Fix semver ordering in rolldown stats charts (#68)

Co-authored-by: Boshen <[email protected]>

Author: Copilot

apps/dashboard/package.json

@@ -14,13 +14,15 @@
     "react": "^19.1.1",
     "react-dom": "^19.1.1",
     "react-router-dom": "^7.8.2",
-    "recharts": "^2.12.6"
+    "recharts": "^2.12.6",
+    "semver": "^7.7.2"
   },
   "devDependencies": {
     "@tailwindcss/vite": "^4.1.13",
     "@types/react": "^19.1.10",
     "@types/react-dom": "^19.1.7",
     "@types/react-router-dom": "^5.3.3",
+    "@types/semver": "^7.7.1",
     "rolldown-vite": "7.1.5",
     "tailwindcss": "^4.1.13",
     "typescript": "catalog:"

apps/dashboard/src/RolldownStats.tsx

@@ -11,6 +11,7 @@ import {
   XAxis,
   YAxis,
 } from 'recharts';
+import * as semver from 'semver';
 import rolldownStats from '../../../rolldown-version-stats.json';
 
 // Utility function to format numbers with commas
@@ -33,10 +34,13 @@ const buildTimeData = rolldownStats.map(stat => ({
   value: stat.buildTime,
   version: stat.version,
   publicationDate: (stat as any).publicationDate,
-})).sort((a, b) => a.value - b.value); // Sort from smallest to largest
+})).sort((a, b) => semver.compare(a.version, b.version)); // Sort by semantic version
 
 // Calculate bundle size differences between consecutive versions
-const bundleSizeDiffData = rolldownStats.map((stat, index) => {
+// First, sort the rolldown stats by semver order
+const sortedRolldownStats = [...rolldownStats].sort((a, b) => semver.compare(a.version, b.version));
+
+const bundleSizeDiffData = sortedRolldownStats.map((stat, index) => {
   if (index === 0) {
     // For the first version, show 0 difference or could show absolute value
     return {
@@ -50,7 +54,7 @@ const bundleSizeDiffData = rolldownStats.map((stat, index) => {
     };
   }
 
-  const prevSize = rolldownStats[index - 1].totalSize;
+  const prevSize = sortedRolldownStats[index - 1].totalSize;
   const currentSize = stat.totalSize;
   const diff = currentSize - prevSize;
 
@@ -63,7 +67,7 @@ const bundleSizeDiffData = rolldownStats.map((stat, index) => {
     version: stat.version,
     publicationDate: (stat as any).publicationDate,
   };
-}).sort((a, b) => a.value - b.value); // Sort from smallest to largest
+}); // Already sorted by semver order, no need to sort again
 
 interface RolldownStatsProps {
   selectedMetric: string;