CodeForPhilly / CodeForPhilly/codeforphilly-ng

Code-split the apps/web bundle

未关闭
#31 0 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看
主要语言
TypeScript
星标
1
派生
1
平均合并
5 天 3 小时
30 天内合并 PR
9

描述

**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)

贡献指南

这个仓库没有索引到贡献指南

调研方向

先阅读 App.tsx 以及 PR #28 引入的静态屏幕导入,然后运行现有的 production build 和 smoke tests,以建立基线。拆分各个屏幕,使 home route 只保留 shell 和 hero 代码,并验证没有任何 chunk 在 gzip 压缩后超过 200 kB,且 smoke tests 仍能成功渲染。

由索引模型根据 Issue 内容生成。

评估

技术栈
react, typescript, vite
领域
build-system, frontend, performance
Issue 类型
重构
难度
3/5
预计耗时
1-2 天
活跃度
冷清
描述清晰度
基本清楚
新手友好度
68/100

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。