Angular与React的Tree Shaking差异究竟是什么？

• Angular的Tree Shaking优势来自架构本身：Angular采用的增量DOM会在编译阶段把模板直接转换成可执行的DOM操作代码，此时编译器能精准识别哪些组件、指令、管道完全未被使用，Tree Shaking工具可直接将这些死代码从最终包中移除——这是增量DOM架构自带的原生能力。
• React的Tree Shaking是工具链+生态优化的结果：React的虚拟DOM确实在运行时做对比，但这不代表它无法实现Tree Shaking：
  • 从React 16.8引入Hook开始，配合ES模块的import/export语法，Webpack、Rollup这类打包工具能通过静态分析识别出未被引用的Hook、组件，进而移除它们。
  • React的生产构建会自动剔除开发相关代码，React.lazy这类按需加载特性也能和Tree Shaking配合进一步减小包体积。
  • 当前大部分React生态库都以ES模块形式发布，让Tree Shaking也能作用到第三方依赖上。
• 核心区别：Angular的Tree Shaking是架构层面的原生支持，编译过程直接参与死代码识别；React的Tree Shaking则依赖工具链的静态分析能力实现，和虚拟DOM本身不冲突，但做不到Angular那样在编译阶段就完成最彻底的死代码清理。

内容的提问来源于stack exchange，提问作者Barstok