文章梗概

1. 什么是tree shaking

2. 为何须要tree shaking

3. tree shaking道理

什么是tree shaking

tree shaking起首是由rollup的作者提出的，它是DCE（dead code elimination）的一个完成，经由过程tree shaking的剖析，能够使你代码里没有运用的代码悉数删除。但是它又区分于一般的dec，这里作者有一个比方很抽象

imagine that you made cakes by throwing whole eggs into the mixing bowl and smashing them up, instead of cracking them open and pouring the contents out. Once the cake comes out of the oven, you remove the fragments of eggshell, except that’s quite tricky so most of the eggshell gets left in there.

简朴翻译一下就是，假如将dec比作制造蛋糕，传统的dec做法就是，将全部鸡蛋丢进碗里搅拌，然后放进烤箱，烤完以后从做好的蛋糕里，找到不须要的蛋壳抛弃，而tree shaking是将鸡蛋突破把蛋黄等有效的东西丢进碗里搅拌，末了直接做出蛋糕。

为何须要tree shaking

重要照样为了削减页面的加载时候，将无用的代码删除，削减js包的大小，从而削减用户守候的时候，运用户不因为冗长的守候而脱离。
那为何已经有了dec，还要做tree shaking呢，依据作者的意义是，因为js静态语法剖析的局限性，从已有代码里去删除代码不如去寻觅真正运用的代码来的好。

tree shaking完成的道理

实在关于tree shaking的完成道理上文若干都有提到，用一句话诠释就是，找到你全部代码里真正运用的代码，打包进去，那末没用的代码天然就剔除了。
但是事变并不是说的那末简朴，我们怎样晓得哪些代码有效，哪些代码没用呢？实在tree shaking得以完成，是依靠es6的module模块的。是es6的模块特征，奠基了tree shaking的完成基本。
关于es6 module的特征，大概有以下几点：

1. 必需写在最外层，不能写在函数里

2. import的语句具有和var一样的提拔(hoist)特征。

详细另有哪些特征能够查一下文档。

tree shaking起首会剖析文件项目里详细哪些代码被引入了，哪些没有引入，然后将真正引入的代码打包进去，末了没有运用到的代码天然就不会存在了。