Uses FormDuration and FormTime to format times that are 0 into something more readable

src/devtools/views/Profiler/FlamegraphChartBuilder.js

@@ -1,6 +1,6 @@
 // @flow
 
-import { calculateSelfDuration, fineTune } from './utils';
+import { calculateSelfDuration, formatDuration } from './utils';
 
 import type { CommitDetailsFrontend, CommitTreeFrontend } from './types';
 
@@ -68,8 +68,8 @@ export function getChartData({
 
     let label = `${name}${maybeKey}`;
     if (didRender) {
-      label += ` (${fineTune(selfDuration.toFixed(1))}ms of ${fineTune(
-        actualDuration.toFixed(1)
+      label += ` (${formatDuration(selfDuration)}ms of ${formatDuration(
+        actualDuration
       )}ms)`;
     }
 

src/devtools/views/Profiler/RankedChartBuilder.js

@@ -1,6 +1,6 @@
 // @flow
 
-import { calculateSelfDuration, fineTune } from './utils';
+import { calculateSelfDuration, formatDuration } from './utils';
 
 import type { CommitDetailsFrontend, CommitTreeFrontend } from './types';
 
@@ -54,7 +54,7 @@ export function getChartData({
 
     const name = node.displayName || 'Unknown';
     const maybeKey = node.key !== null ? ` key="${node.key}"` : '';
-    const label = `${name}${maybeKey} (${fineTune(selfDuration.toFixed(1))}ms)`;
+    const label = `${name}${maybeKey} (${formatDuration(selfDuration)}ms)`;
     chartNodes.push({
       id,
       label,

src/devtools/views/Profiler/SidebarSelectedFiberInfo.js

@@ -2,7 +2,7 @@
 
 import React, { Fragment, useContext } from 'react';
 import { ProfilerContext } from './ProfilerContext';
-import { formatDuration, formatTime, fineTune } from './utils';
+import { formatDuration, formatTime } from './utils';
 import { StoreContext } from '../context';
 import Button from '../Button';
 import ButtonIcon from '../ButtonIcon';
@@ -50,7 +50,7 @@ export default function SidebarSelectedFiberInfo(_: Props) {
         }
         onClick={() => selectCommitIndex(commitIndex)}
       >
-        {fineTune(formatTime(time))}s for {fineTune(formatDuration(duration))}ms
+        {formatTime(time)}s for {formatDuration(duration)}ms
       </button>
     );
   }

src/devtools/views/Profiler/utils.js

@@ -57,11 +57,11 @@ export const getGradientColor = (value: number) => {
 };
 
 export const formatDuration = (duration: number) =>
-  Math.round(duration * 10) / 10;
+  Math.round(duration * 10) / 10 || '<0.1';
 export const formatPercentage = (percentage: number) =>
   Math.round(percentage * 100);
 export const formatTime = (timestamp: number) =>
-  Math.round(Math.round(timestamp) / 100) / 10;
+  Math.round(Math.round(timestamp) / 100) / 10 || '<0.1';
 
 export const scale = (
   minValue: number,
@@ -72,10 +72,3 @@ export const scale = (
   maxValue - minValue === 0
     ? fallbackValue
     : ((value - minValue) / (maxValue - minValue)) * (maxRange - minRange);
-
-export const fineTune = (duration: number | string): string => {
-  if (Number(duration) === 0) {
-    return '<0.1';
-  }
-  return `${duration}`;
-};