update tpot to itl in labels and code use

src/guidellm/presentation/data_models.py

@@ -208,7 +208,7 @@ def from_distribution_summary(
 
 class BenchmarkDatum(BaseModel):
     requests_per_second: float
-    tpot: TabularDistributionSummary
+    itl: TabularDistributionSummary
     ttft: TabularDistributionSummary
     throughput: TabularDistributionSummary
     time_per_request: TabularDistributionSummary
@@ -217,7 +217,7 @@ class BenchmarkDatum(BaseModel):
     def from_benchmark(cls, bm: "GenerativeBenchmark"):
         return cls(
             requests_per_second=bm.metrics.requests_per_second.successful.mean,
-            tpot=TabularDistributionSummary.from_distribution_summary(
+            itl=TabularDistributionSummary.from_distribution_summary(
                 bm.metrics.inter_token_latency_ms.successful
             ),
             ttft=TabularDistributionSummary.from_distribution_summary(

src/ui/lib/components/MetricsSummary/MetricsSummary.component.tsx

@@ -54,15 +54,15 @@ export const Component = () => {
 
   const {
     ttft: ttftSLO,
-    tpot: tpotSLO,
+    itl: itlSLO,
     timePerRequest: timePerRequestSLO,
     throughput: throughputSLO,
     percentile,
     minX,
     maxX,
     errors,
     handleTtft,
-    handleTpot,
+    handleItl,
     handleTimePerRequest,
     handleThroughput,
     handlePercentileChange,
@@ -72,8 +72,8 @@ export const Component = () => {
   const isTtftMatch = Boolean(
     ttftSLO && interpolatedMetricData.ttft.enforcedPercentileValue <= ttftSLO
   );
-  const isTpotMatch = Boolean(
-    tpotSLO && interpolatedMetricData.tpot.enforcedPercentileValue <= tpotSLO
+  const isItlMatch = Boolean(
+    itlSLO && interpolatedMetricData.itl.enforcedPercentileValue <= itlSLO
   );
   const isTprMatch = Boolean(
     timePerRequestSLO &&
@@ -123,7 +123,7 @@ export const Component = () => {
           <FieldsContainer data-id="fields-container">
             <FieldCell data-id="field-cell-1">
               <Input
-                label="TTFT (ms)"
+                label="TIME TO FIRST TOKEN (ms)"
                 value={ttftSLO}
                 onChange={handleTtft}
                 fullWidth
@@ -133,12 +133,12 @@ export const Component = () => {
             </FieldCell>
             <FieldCell data-id="field-cell-2">
               <Input
-                label="TPOT (ms)"
-                value={tpotSLO}
-                onChange={handleTpot}
+                label="INTER-TOKEN LATENCY (ms)"
+                value={itlSLO}
+                onChange={handleItl}
                 fullWidth
                 fontColor={LineColor.Secondary}
-                error={errors?.tpot}
+                error={errors?.itl}
               />
             </FieldCell>
             <FieldCell data-id="field-cell-3">
@@ -212,7 +212,7 @@ export const Component = () => {
         </MiddleColumn>
         <MiddleColumn item xs={3}>
           <MetricValue
-            label="TTFT"
+            label="time to first token"
             value={`${formatNumber(interpolatedMetricData.ttft.enforcedPercentileValue)} ms`}
             match={isTtftMatch}
             valueColor={LineColor.Primary}
@@ -222,17 +222,17 @@ export const Component = () => {
         <MiddleColumn sx={{ paddingLeft: '0px !important' }} item xs={9}>
           <GraphContainer>
             <MetricLine
-              data={[{ id: 'tpot', data: lineDataByRps.tpot || [] }]}
-              threshold={tpotSLO}
+              data={[{ id: 'itl', data: lineDataByRps.itl || [] }]}
+              threshold={itlSLO}
               lineColor={LineColor.Secondary}
             />
           </GraphContainer>
         </MiddleColumn>
         <MiddleColumn item xs={3}>
           <MetricValue
-            label="TPOT"
-            value={`${formatNumber(interpolatedMetricData.tpot.enforcedPercentileValue)} ms`}
-            match={isTpotMatch}
+            label="inter-token latency"
+            value={`${formatNumber(interpolatedMetricData.itl.enforcedPercentileValue)} ms`}
+            match={isItlMatch}
             valueColor={LineColor.Secondary}
           />
         </MiddleColumn>

src/ui/lib/components/MetricsSummary/useSummary.ts

@@ -13,7 +13,7 @@ type Errors = { [key: string]: string | undefined };
 
 const initErrorsState: Errors = {
   ttft: undefined,
-  tpot: undefined,
+  itl: undefined,
   timePerRequest: undefined,
   throughput: undefined,
 };
@@ -47,20 +47,20 @@ export const useSummary = () => {
   const dispatch = useDispatch();
 
   const { current, enforcedPercentile, tasksDefaults } = useSelector(selectSloState);
-  const { ttft, tpot, timePerRequest, throughput } = useSelector(
+  const { ttft, itl, timePerRequest, throughput } = useSelector(
     selectMetricsSummaryLineData
   );
 
   const [errors, setErrors] = useState<Errors>(initErrorsState);
 
   const ttftLimits = findMinMax(ttft || []);
-  const tpotLimits = findMinMax(tpot || []);
+  const itlLimits = findMinMax(itl || []);
   const timePerRequestLimits = findMinMax(timePerRequest || []);
   const throughputLimits = findMinMax(throughput || []);
 
   const limitsByMetric = {
     ttft: ttftLimits,
-    tpot: tpotLimits,
+    itl: itlLimits,
     timePerRequest: timePerRequestLimits,
     throughput: throughputLimits,
   };
@@ -112,7 +112,7 @@ export const useSummary = () => {
     maxX: ttftLimits.maxX,
     errors,
     handleTtft: handleChange('ttft'),
-    handleTpot: handleChange('tpot'),
+    handleItl: handleChange('itl'),
     handleTimePerRequest: handleChange('timePerRequest'),
     handleThroughput: handleChange('throughput'),
     handlePercentileChange,

src/ui/lib/components/WorkloadMetrics/WorkloadMetrics.component.tsx

@@ -36,14 +36,14 @@ export const leftColumn3 = (rpsValue: number, value: number, units: string) => (
 
 export const Component = () => {
   const { data } = useGetBenchmarksQuery();
-  const { ttft, tpot, timePerRequest, throughput } = useSelector(
+  const { ttft, itl, timePerRequest, throughput } = useSelector(
     selectMetricsDetailsLineData
   );
   const { currentRequestRate } = useSelector(selectSloState);
   const formattedRequestRate = formatNumber(currentRequestRate);
   const {
     ttft: ttftAtRPS,
-    tpot: tpotAtRPS,
+    itl: itlAtRPS,
     timePerRequest: timePerRequestAtRPS,
     throughput: throughputAtRPS,
   } = useSelector(selectInterpolatedMetrics);
@@ -57,49 +57,49 @@ export const Component = () => {
       <BlockHeader label="Metrics Details" />
       <Box display="flex" flexDirection="row" gap={3} mt={3}>
         <MetricsContainer
-          header="TTFT"
+          header="TIME TO FIRST TOKEN"
           leftColumn={leftColumn(
             formattedRequestRate,
             formatNumber(ttftAtRPS.mean),
             'ms'
           )}
           rightColumn={columnContent(formattedRequestRate, ttftAtRPS.percentiles, 'ms')}
         >
-          <GraphTitle title="TTFS vs RPS" />
+          <GraphTitle title="Time to First Token vs RPS" />
           <GraphsWrapper>
             <DashedLine
               data={ttft}
               margins={{ left: 50, bottom: 50 }}
               xLegend="request per sec"
-              yLegend="ttft (ms)"
+              yLegend="time to first token (ms)"
               minX={minX}
             />
           </GraphsWrapper>
         </MetricsContainer>
         <MetricsContainer
-          header="TPOT"
+          header="INTER-TOKEN LATENCY"
           leftColumn={leftColumn3(
             formattedRequestRate,
-            formatNumber(tpotAtRPS.mean),
+            formatNumber(itlAtRPS.mean),
             'ms'
           )}
-          rightColumn={columnContent(formattedRequestRate, tpotAtRPS.percentiles, 'ms')}
+          rightColumn={columnContent(formattedRequestRate, itlAtRPS.percentiles, 'ms')}
         >
-          <GraphTitle title="TPOT vs RPS" />
+          <GraphTitle title="Inter-token Latency vs RPS" />
           <GraphsWrapper>
             <DashedLine
-              data={tpot}
+              data={itl}
               margins={{ left: 50, bottom: 50 }}
               xLegend="request per sec"
-              yLegend="tpot (ms)"
+              yLegend="inter-token latency (ms)"
               minX={minX}
             />
           </GraphsWrapper>
         </MetricsContainer>
       </Box>
       <Box display="flex" flexDirection="row" gap={3} mt={3}>
         <MetricsContainer
-          header="E2E Latency"
+          header="Time Per Request"
           leftColumn={leftColumn(
             formattedRequestRate,
             formatNumber(timePerRequestAtRPS.mean),
@@ -111,13 +111,13 @@ export const Component = () => {
             's'
           )}
         >
-          <GraphTitle title="E2E Latency vs RPS" />
+          <GraphTitle title="Time Per Request vs RPS" />
           <GraphsWrapper>
             <DashedLine
               data={timePerRequest}
               margins={{ left: 50, bottom: 50 }}
               xLegend="request per sec"
-              yLegend="latency (s)"
+              yLegend="time per request (s)"
               minX={minX}
             />
           </GraphsWrapper>

src/ui/lib/store/benchmarksWindowData.ts

@@ -1,7 +1,7 @@
 export const benchmarksScript = `window.benchmarks = [
   {
     requestsPerSecond: 11.411616848282272,
-    tpot: {
+    itl: {
       mean: 8.758024845683707,
       median: 8.788176945277623,
       mode: 7.119315011160714,
@@ -172,7 +172,7 @@ export const benchmarksScript = `window.benchmarks = [
   },
   {
     requestsPerSecond: 36.289181300710815,
-    tpot: {
+    itl: {
       mean: 588.0161376137819,
       median: 461.7137227739607,
       mode: 323.1611592429025,
@@ -343,7 +343,7 @@ export const benchmarksScript = `window.benchmarks = [
   },
   {
     requestsPerSecond: 20.752070927855794,
-    tpot: {
+    itl: {
       mean: 116.28360712595156,
       median: 26.769569941929408,
       mode: 10.624987738473076,
@@ -514,7 +514,7 @@ export const benchmarksScript = `window.benchmarks = [
   },
   {
     requestsPerSecond: 26.81917480361788,
-    tpot: {
+    itl: {
       mean: 299.7306064613554,
       median: 372.7384294782366,
       mode: 13.360295976911273,
@@ -685,7 +685,7 @@ export const benchmarksScript = `window.benchmarks = [
   },
   {
     requestsPerSecond: 26.823988819498975,
-    tpot: {
+    itl: {
       mean: 683.8011571339198,
       median: 742.2689029148647,
       mode: 317.1694278717041,
@@ -856,7 +856,7 @@ export const benchmarksScript = `window.benchmarks = [
   },
   {
     requestsPerSecond: 24.50047903792646,
-    tpot: {
+    itl: {
       mean: 742.9258901891964,
       median: 773.0941431862967,
       mode: 538.750410079956,
@@ -1027,7 +1027,7 @@ export const benchmarksScript = `window.benchmarks = [
   },
   {
     requestsPerSecond: 25.617829792196602,
-    tpot: {
+    itl: {
       mean: 663.3098317044122,
       median: 613.7458937508719,
       mode: 440.9824098859514,
@@ -1198,7 +1198,7 @@ export const benchmarksScript = `window.benchmarks = [
   },
   {
     requestsPerSecond: 37.02892550982192,
-    tpot: {
+    itl: {
       mean: 606.4144710877113,
       median: 543.5235500335693,
       mode: 331.6155501774379,
@@ -1369,7 +1369,7 @@ export const benchmarksScript = `window.benchmarks = [
   },
   {
     requestsPerSecond: 37.29183354201869,
-    tpot: {
+    itl: {
       mean: 603.3237551205925,
       median: 528.1183038439069,
       mode: 400.96027510506764,
@@ -1540,7 +1540,7 @@ export const benchmarksScript = `window.benchmarks = [
   },
   {
     requestsPerSecond: 37.45318312972309,
-    tpot: {
+    itl: {
       mean: 600.7204526769262,
       median: 626.2100083487375,
       mode: 398.7384523664202,

src/ui/lib/store/mockData.ts

@@ -95,7 +95,7 @@ export const benchmarks = [
       ],
       bucketWidth: 0,
     },
-    tpot: {
+    itl: {
       statistics: {
         total: 0,
         mean: 0,

src/ui/lib/store/slices/benchmarks/benchmarks.api.ts

@@ -45,9 +45,9 @@ const setDefaultSLOs = (
     lastBM?.ttft,
     defaultPercentile
   );
-  const tpotAvg = getAverageValueForPercentile(
-    firstBM?.tpot,
-    lastBM?.tpot,
+  const itlAvg = getAverageValueForPercentile(
+    firstBM?.itl,
+    lastBM?.itl,
     defaultPercentile
   );
   const timePerRequestAvg = getAverageValueForPercentile(
@@ -66,13 +66,13 @@ const setDefaultSLOs = (
       currentRequestRate: firstBM?.requestsPerSecond,
       current: {
         ttft: formatNumber(ttftAvg, 0),
-        tpot: formatNumber(tpotAvg, 0),
+        itl: formatNumber(itlAvg, 0),
         timePerRequest: formatNumber(timePerRequestAvg, 0),
         throughput: formatNumber(throughputAvg, 0),
       },
       tasksDefaults: {
         ttft: formatNumber(ttftAvg, 0),
-        tpot: formatNumber(tpotAvg, 0),
+        itl: formatNumber(itlAvg, 0),
         timePerRequest: formatNumber(timePerRequestAvg, 0),
         throughput: formatNumber(throughputAvg, 0),
       },

src/ui/lib/store/slices/benchmarks/benchmarks.interfaces.ts

@@ -20,7 +20,7 @@ interface Percentile {
 
 export interface BenchmarkMetrics {
   ttft: Statistics;
-  tpot: Statistics;
+  itl: Statistics;
   timePerRequest: Statistics;
   throughput: Statistics;
 }