CodeForPhilly / CodeForPhilly/codeforphilly-ng
Code-split the apps/web bundle
- Vorherrschende Sprache
- TypeScript
- Sterne
- 1
- Forks
- 1
- Ø Merge
- 5 T. 3 Std.
- Gemergte PRs (30 T.)
- 9
Beschreibung
**Context:** PR #28 ships every public screen statically imported by `App.tsx`. The production bundle is 550 kB (164 kB gzipped), which vite warns about at build time.
The cheapest fix is `React.lazy()` on each screen so each route splits naturally. The shell + home are the hot path; everything else can lazy-load.
**Acceptance:**
- [ ] No single chunk > 200 kB gzipped
- [ ] First-paint route (`/`) loads only the hero + shell-needed code
- [ ] Smoke tests still pass (lazy + Suspense boundary doesn't break the render harness)
Beitragsleitfaden
Für dieses Repository ist kein Beitragsleitfaden indexiert
Rechercherichtung
Lies zunächst App.tsx und die statischen Screen-Imports, die durch PR #28 eingeführt wurden, und führe dann den vorhandenen Produktions-Build sowie die Smoke-Tests aus, um die Ausgangsbasis festzuhalten. Teile die Screens so auf, dass die Home-Route nur den Shell- und Hero-Code enthält, und überprüfe, dass kein Chunk 200 kB gzip-komprimiert überschreitet und die Smoke-Tests weiterhin erfolgreich gerendert werden.
Vom Indexierungsmodell aus dem Issue-Text verfasst.
Bewertung
- Tech-Stack
- react, typescript, vite
- Bereich
- build-system, frontend, performance
- Issue-Typ
- Refactoring
- Schwierigkeit
- 3/5
- Geschätzter Aufwand
- 1-2 Tage
- Aktivitätsstatus
- Ruhig
- Klarheit
- Größtenteils klar
- Anfängerfreundlichkeit
- 68/100