Appearance
Tree Shaking 与 Code Splitting：删掉不用的代码和推迟加载不是一回事
主题边界
- Tree Shaking 关注静态可判定的无用导出删除；Code Splitting 关注模块图按入口和动态边界切分。
- 它们都会影响体积和首屏，但机制完全不同。
机制与流程
- Tree Shaking 依赖 ESM 静态导入导出关系、无副作用判定和压缩阶段的 dead code elimination。
package.json中的sideEffects、Rollup 的 treeshake 配置、函数纯度标记会影响摇树效果。- Code Splitting 通过多入口、动态 import、共享依赖抽取和路由级懒加载把模块图拆成多个 chunk。
关键差异
- 摇树删的是永远用不到的代码，分包推迟的是暂时不用的代码。
- 一个包即使成功分割，如果内部副作用声明不清，仍可能无法摇掉冗余内容。
边界条件
- CommonJS、动态访问导出、全局副作用初始化都会削弱 Tree Shaking。
- 过度分包会带来过多请求、执行碎片化和缓存命中下降，尤其在 HTTP/1.1 或低端设备上。
工程落点
- 优化包体积时要同时看静态删除率、chunk 图、共享依赖重复率和首屏实际执行量。
- 组件库和业务模块都应明确副作用边界，否则构建工具无法安全删除代码。