tree-shaking

tree-shaking 是 webpack2 新增的一种功能

从文件入口作为起点，分析模块的依赖关系，把没有用掉的模块删掉

tree-shaking 是 DCE 的一种新的实现

DCE(dead code elimination)

编译器会判断哪些代码不影响输出，然后消除这些代码

注意： tree-shaking 和传统的 DCE 方法不太一样，传统的 DCE 消灭不可能执行的代码，而 tree-shaking 更关注消除没有用到的代码

js 的 DCE

在编译型语言中，都是由编译器将 dead code 从 AST 中删除

关于 js 的 DCE，在 js 代码被送到浏览器之前已经做好了 DCE，这个工作是由代码压缩优化工具 uglify 完成的

tree-shaking 的基础

tree-shaking 的消除原理是依赖于 ES6 的模块特性：

ES6 模块的依赖关系是确定的，和运行时的状态无关，可以不执行代码，从字面量上对代码进行分析

参考
https://juejin.cn/post/6844903544756109319

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成，浏览时请结合常识与多方信息审慎甄别。
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。