@buoy-gg/benchmark 2.1.3 → 2.1.4-beta.1

package/lib/commonjs/components/BenchmarkCompareView.js

@@ -1 +1,475 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.BenchmarkCompareView=BenchmarkCompareView,exports.default=void 0;var _react=_interopRequireDefault(require("react")),_reactNative=require("react-native"),_sharedUi=require("@buoy-gg/shared-ui"),_benchmarking=require("../benchmarking"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function formatMs(e){return e<1?`${(1e3*e).toFixed(0)}μs`:e<10?`${e.toFixed(2)}ms`:e<100?`${e.toFixed(1)}ms`:`${e.toFixed(0)}ms`}function formatPercent(e){return`${e>=0?"+":""}${e.toFixed(1)}%`}function getImprovementColor(e){return e>5?_sharedUi.macOSColors.semantic.success:e<-5?_sharedUi.macOSColors.semantic.error:_sharedUi.macOSColors.text.secondary}function getIndicator(e){return e>5?"✅":e<-5?"❌":"➖"}function SectionHeader({title:e}){return(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.sectionHeader,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.sectionTitle,children:e})})}function CompareRow({label:e,baseline:t,comparison:s,improvement:a,unit:r="ms"}){return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.compareRow,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.compareLabel,children:e}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.compareValues,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.baselineValue,children:t}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.arrow,children:"→"}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.comparisonValue,children:s}),(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:[styles.improvementValue,{color:getImprovementColor(a)}],children:[formatPercent(a)," ",getIndicator(a)]})]})]})}function BenchmarkCompareView({baseline:e,comparison:t}){const s=_benchmarking.BenchmarkComparator.compare(e,t);return(0,_jsxRuntime.jsxs)(_reactNative.ScrollView,{style:styles.container,contentContainerStyle:styles.content,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.overallResult,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.overallEmoji,children:s.isImproved?"🎉":"⚠️"}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.overallText,children:s.isImproved?"IMPROVED":"REGRESSED"}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.overallPercent,{color:getImprovementColor(s.overallImprovement)}],children:formatPercent(s.overallImprovement)})]}),(0,_jsxRuntime.jsx)(SectionHeader,{title:"COMPARING"}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.section,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.reportInfo,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.reportRole,children:"BASELINE"}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.reportName,children:e.name}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.reportDate,children:new Date(e.createdAt).toLocaleString()})]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.vsContainer,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.vsText,children:"vs"})}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.reportInfo,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.reportRole,children:"COMPARISON"}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.reportName,children:t.name}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.reportDate,children:new Date(t.createdAt).toLocaleString()})]})]}),(0,_jsxRuntime.jsx)(SectionHeader,{title:"TIMING COMPARISON"}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.section,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.columnHeaders,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.columnLabel,children:"Metric"}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.columnValues,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.columnHeader,children:"Base"}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.columnHeader}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.columnHeader,children:"After"}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.columnHeader,children:"Change"})]})]}),(0,_jsxRuntime.jsx)(CompareRow,{label:"Measure Time",baseline:formatMs(e.stats.avgMeasureTime),comparison:formatMs(t.stats.avgMeasureTime),improvement:s.measureTimeImprovement}),(0,_jsxRuntime.jsx)(CompareRow,{label:"Pipeline Time",baseline:formatMs(e.stats.avgTotalTime),comparison:formatMs(t.stats.avgTotalTime),improvement:s.pipelineTimeImprovement}),(0,_jsxRuntime.jsx)(CompareRow,{label:"Filter Time",baseline:formatMs(e.stats.avgFilterTime),comparison:formatMs(t.stats.avgFilterTime),improvement:s.filterTimeImprovement}),(0,_jsxRuntime.jsx)(CompareRow,{label:"Track Time",baseline:formatMs(e.stats.avgTrackTime),comparison:formatMs(t.stats.avgTrackTime),improvement:s.trackTimeImprovement}),(0,_jsxRuntime.jsx)(CompareRow,{label:"Overlay Render",baseline:formatMs(e.stats.avgOverlayRenderTime),comparison:formatMs(t.stats.avgOverlayRenderTime),improvement:s.overlayRenderImprovement})]}),(0,_jsxRuntime.jsx)(SectionHeader,{title:"PERCENTILES"}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.section,children:[(0,_jsxRuntime.jsx)(CompareRow,{label:"P50 (Median)",baseline:formatMs(e.stats.p50TotalTime),comparison:formatMs(t.stats.p50TotalTime),improvement:e.stats.p50TotalTime>0?(e.stats.p50TotalTime-t.stats.p50TotalTime)/e.stats.p50TotalTime*100:0}),(0,_jsxRuntime.jsx)(CompareRow,{label:"P95",baseline:formatMs(e.stats.p95TotalTime),comparison:formatMs(t.stats.p95TotalTime),improvement:e.stats.p95TotalTime>0?(e.stats.p95TotalTime-t.stats.p95TotalTime)/e.stats.p95TotalTime*100:0}),(0,_jsxRuntime.jsx)(CompareRow,{label:"P99",baseline:formatMs(e.stats.p99TotalTime),comparison:formatMs(t.stats.p99TotalTime),improvement:e.stats.p99TotalTime>0?(e.stats.p99TotalTime-t.stats.p99TotalTime)/e.stats.p99TotalTime*100:0})]}),(0,_jsxRuntime.jsx)(SectionHeader,{title:"BATCH STATISTICS"}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.section,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.statComparison,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.statLabel,children:"Total Batches"}),(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.statValues,children:[e.stats.batchCount," → ",t.stats.batchCount]})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.statComparison,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.statLabel,children:"Nodes Processed"}),(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.statValues,children:[e.stats.totalNodesProcessed.toLocaleString()," →"," ",t.stats.totalNodesProcessed.toLocaleString()]})]})]}),null!=e.memoryDelta&&null!=t.memoryDelta&&(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(SectionHeader,{title:"MEMORY"}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.section,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.statComparison,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.statLabel,children:"Memory Delta"}),(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:[styles.statValues,{color:null!=s.memoryDeltaChange&&s.memoryDeltaChange<0?_sharedUi.macOSColors.semantic.success:_sharedUi.macOSColors.text.primary}],children:[(e.memoryDelta/1024/1024).toFixed(2),"MB →"," ",(t.memoryDelta/1024/1024).toFixed(2),"MB"]})]})})]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.footer,children:(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.footerText,children:["Compared at ",new Date(s.comparedAt).toLocaleString()]})})]})}const styles=_reactNative.StyleSheet.create({container:{flex:1},content:{paddingVertical:16},overallResult:{alignItems:"center",paddingVertical:24,backgroundColor:_sharedUi.macOSColors.background.card,marginHorizontal:16,borderRadius:12,borderWidth:1,borderColor:_sharedUi.macOSColors.border.default,marginBottom:16},overallEmoji:{fontSize:32,marginBottom:8},overallText:{fontSize:14,fontWeight:"700",color:_sharedUi.macOSColors.text.primary,fontFamily:"monospace",letterSpacing:2,marginBottom:4},overallPercent:{fontSize:24,fontWeight:"700",fontFamily:"monospace"},sectionHeader:{paddingHorizontal:16,paddingVertical:8,backgroundColor:_sharedUi.macOSColors.background.hover,borderTopWidth:1,borderBottomWidth:1,borderColor:_sharedUi.macOSColors.border.default,marginTop:8},sectionTitle:{fontSize:11,fontWeight:"600",color:_sharedUi.macOSColors.text.secondary,fontFamily:"monospace",letterSpacing:1},section:{paddingHorizontal:16,paddingVertical:8},reportInfo:{flex:1,paddingVertical:8},reportRole:{fontSize:10,fontWeight:"600",color:_sharedUi.macOSColors.text.muted,fontFamily:"monospace",letterSpacing:1,marginBottom:4},reportName:{fontSize:13,fontWeight:"600",color:_sharedUi.macOSColors.text.primary,fontFamily:"monospace",marginBottom:2},reportDate:{fontSize:11,color:_sharedUi.macOSColors.text.secondary,fontFamily:"monospace"},vsContainer:{paddingHorizontal:16,justifyContent:"center"},vsText:{fontSize:12,color:_sharedUi.macOSColors.text.muted,fontFamily:"monospace"},columnHeaders:{flexDirection:"row",justifyContent:"space-between",paddingBottom:8,borderBottomWidth:1,borderColor:_sharedUi.macOSColors.border.default,marginBottom:8},columnLabel:{fontSize:10,color:_sharedUi.macOSColors.text.muted,fontFamily:"monospace",width:80},columnValues:{flexDirection:"row",flex:1,justifyContent:"flex-end",gap:8},columnHeader:{fontSize:10,color:_sharedUi.macOSColors.text.muted,fontFamily:"monospace",width:50,textAlign:"center"},compareRow:{flexDirection:"row",justifyContent:"space-between",alignItems:"center",paddingVertical:8},compareLabel:{fontSize:12,color:_sharedUi.macOSColors.text.secondary,fontFamily:"monospace",width:80},compareValues:{flexDirection:"row",alignItems:"center",flex:1,justifyContent:"flex-end",gap:4},baselineValue:{fontSize:11,color:_sharedUi.macOSColors.text.muted,fontFamily:"monospace",width:50,textAlign:"right"},arrow:{fontSize:11,color:_sharedUi.macOSColors.text.muted,paddingHorizontal:4},comparisonValue:{fontSize:11,color:_sharedUi.macOSColors.text.primary,fontFamily:"monospace",fontWeight:"500",width:50,textAlign:"right"},improvementValue:{fontSize:11,fontFamily:"monospace",fontWeight:"600",width:70,textAlign:"right"},statComparison:{flexDirection:"row",justifyContent:"space-between",alignItems:"center",paddingVertical:6},statLabel:{fontSize:12,color:_sharedUi.macOSColors.text.secondary,fontFamily:"monospace"},statValues:{fontSize:12,color:_sharedUi.macOSColors.text.primary,fontFamily:"monospace"},footer:{paddingHorizontal:16,paddingVertical:16,marginTop:16,borderTopWidth:1,borderColor:_sharedUi.macOSColors.border.default},footerText:{fontSize:10,color:_sharedUi.macOSColors.text.muted,fontFamily:"monospace",textAlign:"center"}});var _default=exports.default=BenchmarkCompareView;
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.BenchmarkCompareView = BenchmarkCompareView;
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactNative = require("react-native");
+var _sharedUi = require("@buoy-gg/shared-ui");
+var _benchmarking = require("../benchmarking");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+/**
+ * BenchmarkCompareView
+ *
+ * Displays a comparison between two benchmark reports.
+ * Shows side-by-side metrics with improvement/regression indicators.
+ */
+
+/**
+ * Format milliseconds with appropriate precision
+ */
+function formatMs(ms) {
+  if (ms < 1) return `${(ms * 1000).toFixed(0)}μs`;
+  if (ms < 10) return `${ms.toFixed(2)}ms`;
+  if (ms < 100) return `${ms.toFixed(1)}ms`;
+  return `${ms.toFixed(0)}ms`;
+}
+
+/**
+ * Format percentage with sign
+ */
+function formatPercent(value) {
+  const sign = value >= 0 ? "+" : "";
+  return `${sign}${value.toFixed(1)}%`;
+}
+
+/**
+ * Get color based on improvement (positive = good)
+ */
+function getImprovementColor(improvement) {
+  if (improvement > 5) return _sharedUi.macOSColors.semantic.success;
+  if (improvement < -5) return _sharedUi.macOSColors.semantic.error;
+  return _sharedUi.macOSColors.text.secondary;
+}
+
+/**
+ * Get emoji indicator
+ */
+function getIndicator(improvement) {
+  if (improvement > 5) return "✅";
+  if (improvement < -5) return "❌";
+  return "➖";
+}
+
+/**
+ * Section header component
+ */
+function SectionHeader({
+  title
+}) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+    style: styles.sectionHeader,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+      style: styles.sectionTitle,
+      children: title
+    })
+  });
+}
+
+/**
+ * Comparison row component
+ */
+function CompareRow({
+  label,
+  baseline,
+  comparison,
+  improvement,
+  unit = "ms"
+}) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+    style: styles.compareRow,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+      style: styles.compareLabel,
+      children: label
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+      style: styles.compareValues,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+        style: styles.baselineValue,
+        children: baseline
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+        style: styles.arrow,
+        children: "\u2192"
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+        style: styles.comparisonValue,
+        children: comparison
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
+        style: [styles.improvementValue, {
+          color: getImprovementColor(improvement)
+        }],
+        children: [formatPercent(improvement), " ", getIndicator(improvement)]
+      })]
+    })]
+  });
+}
+function BenchmarkCompareView({
+  baseline,
+  comparison
+}) {
+  // Generate comparison data
+  const result = _benchmarking.BenchmarkComparator.compare(baseline, comparison);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.ScrollView, {
+    style: styles.container,
+    contentContainerStyle: styles.content,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+      style: styles.overallResult,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+        style: styles.overallEmoji,
+        children: result.isImproved ? "🎉" : "⚠️"
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+        style: styles.overallText,
+        children: result.isImproved ? "IMPROVED" : "REGRESSED"
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+        style: [styles.overallPercent, {
+          color: getImprovementColor(result.overallImprovement)
+        }],
+        children: formatPercent(result.overallImprovement)
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(SectionHeader, {
+      title: "COMPARING"
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+      style: styles.section,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+        style: styles.reportInfo,
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+          style: styles.reportRole,
+          children: "BASELINE"
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+          style: styles.reportName,
+          children: baseline.name
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+          style: styles.reportDate,
+          children: new Date(baseline.createdAt).toLocaleString()
+        })]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        style: styles.vsContainer,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+          style: styles.vsText,
+          children: "vs"
+        })
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+        style: styles.reportInfo,
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+          style: styles.reportRole,
+          children: "COMPARISON"
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+          style: styles.reportName,
+          children: comparison.name
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+          style: styles.reportDate,
+          children: new Date(comparison.createdAt).toLocaleString()
+        })]
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(SectionHeader, {
+      title: "TIMING COMPARISON"
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+      style: styles.section,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+        style: styles.columnHeaders,
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+          style: styles.columnLabel,
+          children: "Metric"
+        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+          style: styles.columnValues,
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+            style: styles.columnHeader,
+            children: "Base"
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+            style: styles.columnHeader
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+            style: styles.columnHeader,
+            children: "After"
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+            style: styles.columnHeader,
+            children: "Change"
+          })]
+        })]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(CompareRow, {
+        label: "Measure Time",
+        baseline: formatMs(baseline.stats.avgMeasureTime),
+        comparison: formatMs(comparison.stats.avgMeasureTime),
+        improvement: result.measureTimeImprovement
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(CompareRow, {
+        label: "Pipeline Time",
+        baseline: formatMs(baseline.stats.avgTotalTime),
+        comparison: formatMs(comparison.stats.avgTotalTime),
+        improvement: result.pipelineTimeImprovement
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(CompareRow, {
+        label: "Filter Time",
+        baseline: formatMs(baseline.stats.avgFilterTime),
+        comparison: formatMs(comparison.stats.avgFilterTime),
+        improvement: result.filterTimeImprovement
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(CompareRow, {
+        label: "Track Time",
+        baseline: formatMs(baseline.stats.avgTrackTime),
+        comparison: formatMs(comparison.stats.avgTrackTime),
+        improvement: result.trackTimeImprovement
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(CompareRow, {
+        label: "Overlay Render",
+        baseline: formatMs(baseline.stats.avgOverlayRenderTime),
+        comparison: formatMs(comparison.stats.avgOverlayRenderTime),
+        improvement: result.overlayRenderImprovement
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(SectionHeader, {
+      title: "PERCENTILES"
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+      style: styles.section,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(CompareRow, {
+        label: "P50 (Median)",
+        baseline: formatMs(baseline.stats.p50TotalTime),
+        comparison: formatMs(comparison.stats.p50TotalTime),
+        improvement: baseline.stats.p50TotalTime > 0 ? (baseline.stats.p50TotalTime - comparison.stats.p50TotalTime) / baseline.stats.p50TotalTime * 100 : 0
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(CompareRow, {
+        label: "P95",
+        baseline: formatMs(baseline.stats.p95TotalTime),
+        comparison: formatMs(comparison.stats.p95TotalTime),
+        improvement: baseline.stats.p95TotalTime > 0 ? (baseline.stats.p95TotalTime - comparison.stats.p95TotalTime) / baseline.stats.p95TotalTime * 100 : 0
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(CompareRow, {
+        label: "P99",
+        baseline: formatMs(baseline.stats.p99TotalTime),
+        comparison: formatMs(comparison.stats.p99TotalTime),
+        improvement: baseline.stats.p99TotalTime > 0 ? (baseline.stats.p99TotalTime - comparison.stats.p99TotalTime) / baseline.stats.p99TotalTime * 100 : 0
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(SectionHeader, {
+      title: "BATCH STATISTICS"
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+      style: styles.section,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+        style: styles.statComparison,
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+          style: styles.statLabel,
+          children: "Total Batches"
+        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
+          style: styles.statValues,
+          children: [baseline.stats.batchCount, " \u2192 ", comparison.stats.batchCount]
+        })]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+        style: styles.statComparison,
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+          style: styles.statLabel,
+          children: "Nodes Processed"
+        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
+          style: styles.statValues,
+          children: [baseline.stats.totalNodesProcessed.toLocaleString(), " \u2192", " ", comparison.stats.totalNodesProcessed.toLocaleString()]
+        })]
+      })]
+    }), baseline.memoryDelta != null && comparison.memoryDelta != null && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(SectionHeader, {
+        title: "MEMORY"
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        style: styles.section,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+          style: styles.statComparison,
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+            style: styles.statLabel,
+            children: "Memory Delta"
+          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
+            style: [styles.statValues, {
+              color: result.memoryDeltaChange != null && result.memoryDeltaChange < 0 ? _sharedUi.macOSColors.semantic.success : _sharedUi.macOSColors.text.primary
+            }],
+            children: [(baseline.memoryDelta / 1024 / 1024).toFixed(2), "MB \u2192", " ", (comparison.memoryDelta / 1024 / 1024).toFixed(2), "MB"]
+          })]
+        })
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: styles.footer,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
+        style: styles.footerText,
+        children: ["Compared at ", new Date(result.comparedAt).toLocaleString()]
+      })
+    })]
+  });
+}
+const styles = _reactNative.StyleSheet.create({
+  container: {
+    flex: 1
+  },
+  content: {
+    paddingVertical: 16
+  },
+  overallResult: {
+    alignItems: "center",
+    paddingVertical: 24,
+    backgroundColor: _sharedUi.macOSColors.background.card,
+    marginHorizontal: 16,
+    borderRadius: 12,
+    borderWidth: 1,
+    borderColor: _sharedUi.macOSColors.border.default,
+    marginBottom: 16
+  },
+  overallEmoji: {
+    fontSize: 32,
+    marginBottom: 8
+  },
+  overallText: {
+    fontSize: 14,
+    fontWeight: "700",
+    color: _sharedUi.macOSColors.text.primary,
+    fontFamily: "monospace",
+    letterSpacing: 2,
+    marginBottom: 4
+  },
+  overallPercent: {
+    fontSize: 24,
+    fontWeight: "700",
+    fontFamily: "monospace"
+  },
+  sectionHeader: {
+    paddingHorizontal: 16,
+    paddingVertical: 8,
+    backgroundColor: _sharedUi.macOSColors.background.hover,
+    borderTopWidth: 1,
+    borderBottomWidth: 1,
+    borderColor: _sharedUi.macOSColors.border.default,
+    marginTop: 8
+  },
+  sectionTitle: {
+    fontSize: 11,
+    fontWeight: "600",
+    color: _sharedUi.macOSColors.text.secondary,
+    fontFamily: "monospace",
+    letterSpacing: 1
+  },
+  section: {
+    paddingHorizontal: 16,
+    paddingVertical: 8
+  },
+  reportInfo: {
+    flex: 1,
+    paddingVertical: 8
+  },
+  reportRole: {
+    fontSize: 10,
+    fontWeight: "600",
+    color: _sharedUi.macOSColors.text.muted,
+    fontFamily: "monospace",
+    letterSpacing: 1,
+    marginBottom: 4
+  },
+  reportName: {
+    fontSize: 13,
+    fontWeight: "600",
+    color: _sharedUi.macOSColors.text.primary,
+    fontFamily: "monospace",
+    marginBottom: 2
+  },
+  reportDate: {
+    fontSize: 11,
+    color: _sharedUi.macOSColors.text.secondary,
+    fontFamily: "monospace"
+  },
+  vsContainer: {
+    paddingHorizontal: 16,
+    justifyContent: "center"
+  },
+  vsText: {
+    fontSize: 12,
+    color: _sharedUi.macOSColors.text.muted,
+    fontFamily: "monospace"
+  },
+  columnHeaders: {
+    flexDirection: "row",
+    justifyContent: "space-between",
+    paddingBottom: 8,
+    borderBottomWidth: 1,
+    borderColor: _sharedUi.macOSColors.border.default,
+    marginBottom: 8
+  },
+  columnLabel: {
+    fontSize: 10,
+    color: _sharedUi.macOSColors.text.muted,
+    fontFamily: "monospace",
+    width: 80
+  },
+  columnValues: {
+    flexDirection: "row",
+    flex: 1,
+    justifyContent: "flex-end",
+    gap: 8
+  },
+  columnHeader: {
+    fontSize: 10,
+    color: _sharedUi.macOSColors.text.muted,
+    fontFamily: "monospace",
+    width: 50,
+    textAlign: "center"
+  },
+  compareRow: {
+    flexDirection: "row",
+    justifyContent: "space-between",
+    alignItems: "center",
+    paddingVertical: 8
+  },
+  compareLabel: {
+    fontSize: 12,
+    color: _sharedUi.macOSColors.text.secondary,
+    fontFamily: "monospace",
+    width: 80
+  },
+  compareValues: {
+    flexDirection: "row",
+    alignItems: "center",
+    flex: 1,
+    justifyContent: "flex-end",
+    gap: 4
+  },
+  baselineValue: {
+    fontSize: 11,
+    color: _sharedUi.macOSColors.text.muted,
+    fontFamily: "monospace",
+    width: 50,
+    textAlign: "right"
+  },
+  arrow: {
+    fontSize: 11,
+    color: _sharedUi.macOSColors.text.muted,
+    paddingHorizontal: 4
+  },
+  comparisonValue: {
+    fontSize: 11,
+    color: _sharedUi.macOSColors.text.primary,
+    fontFamily: "monospace",
+    fontWeight: "500",
+    width: 50,
+    textAlign: "right"
+  },
+  improvementValue: {
+    fontSize: 11,
+    fontFamily: "monospace",
+    fontWeight: "600",
+    width: 70,
+    textAlign: "right"
+  },
+  statComparison: {
+    flexDirection: "row",
+    justifyContent: "space-between",
+    alignItems: "center",
+    paddingVertical: 6
+  },
+  statLabel: {
+    fontSize: 12,
+    color: _sharedUi.macOSColors.text.secondary,
+    fontFamily: "monospace"
+  },
+  statValues: {
+    fontSize: 12,
+    color: _sharedUi.macOSColors.text.primary,
+    fontFamily: "monospace"
+  },
+  footer: {
+    paddingHorizontal: 16,
+    paddingVertical: 16,
+    marginTop: 16,
+    borderTopWidth: 1,
+    borderColor: _sharedUi.macOSColors.border.default
+  },
+  footerText: {
+    fontSize: 10,
+    color: _sharedUi.macOSColors.text.muted,
+    fontFamily: "monospace",
+    textAlign: "center"
+  }
+});
+var _default = exports.default = BenchmarkCompareView;