40 lines
1.9 KiB
Markdown
40 lines
1.9 KiB
Markdown
# Hypothesis: Outdated Dependencies Cause Performance Regressions
|
|
|
|
## Claim
|
|
Outdated dependencies accumulate performance regressions over time through:
|
|
- Missing tree-shaking improvements in newer versions
|
|
- Duplicated polyfills for features now native to the runtime
|
|
- Unoptimized codepaths that newer releases have rewritten
|
|
- Missed bundle-size reductions from internal refactors
|
|
- Transitive dependency bloat from old sub-dependencies
|
|
|
|
## Testing approach
|
|
Upgrade dependencies in order of likely performance impact on the cf-webapp Next.js dashboard (app.codeflash.ai). Build after each batch. Measure bundle size and build time before/after.
|
|
|
|
## Experiment: cf-webapp (2026-04-10)
|
|
|
|
### Baseline
|
|
- 46 outdated packages identified via `npm outdated`
|
|
- 16 major version bumps, ~30 semver-compatible patches
|
|
|
|
### Round 1 — Semver-compatible patches (~30 packages)
|
|
React 19.2.5, Sentry 10.48.0, Radix UI patches, PostCSS 8.5.9, auth0 4.17.0, etc.
|
|
- **Result**: Build passes, 0 vulnerabilities
|
|
|
|
### Round 2 — Major version upgrades (performance-impactful)
|
|
- `posthog-js` 1.127 → 1.367 (analytics SDK, loads every page)
|
|
- `lucide-react` 0.563 → 1.8 (icon library, v1 tree-shaking rewrite; required `Github` → `GitFork` rename — brand icons removed)
|
|
- `tailwind-merge` 2.6 → 3.5 (used in every `cn()` call, v3 smaller/faster runtime)
|
|
- `marked` 16.4 → 18.0 (markdown parser)
|
|
- `react-markdown` 9.1 → 10.1 (required removing `className` prop — dropped in v10)
|
|
- `prettier` 3.2 → 3.8, `lint-staged` 15 → 16, `posthog-node` 4 → 5
|
|
- **Result**: Build passes after migration fixes
|
|
|
|
### Deferred (high migration cost)
|
|
- tailwindcss 3 → 4 (complete CSS framework rewrite)
|
|
- prisma 6 → 7 (database client API changes)
|
|
- zod 3 → 4 (validation API changes)
|
|
- typescript 5 → 6 (type system changes)
|
|
|
|
### Measurements
|
|
TODO: Run `ANALYZE=true npm run build` before/after to capture concrete bundle size deltas.
|