Tree-shaking VS dead code elimination 【翻译】

[z2014]

这里是原文链接Tree-shaking versus dead code elimination

我一直致力于一个叫rollup的工具，它可以将js各个模块打包在一起。其中他有一个特性叫tree-shaking，他会只将你程序需要的js代码打包进去。
有人问我这个概念从哪里得来的？
然后另一个人就说他只是“消除死代码”换了一个名字
又有一个人说这个tree shaking很愚蠢
但是实际上他们是不同的东西，即使他们在做一件相同的事--减少代码

## Dead code elimination is silly

我们来做一个不是很恰当的类比：想象一下你在制作蛋糕的过程中将一整个鸡蛋放进碗里，并且正在捣碎它，而不是我们正常的那种将鸡蛋打开，然后将鸡蛋清之类的倒进去搅拌（类似于鸡蛋汤的操作）。当我们把蛋糕拿出锅的时候，再清理一下鸡蛋壳，这个工作除了十分复杂以外，大部分鸡蛋壳还会遗留在那。

这样，你可能只能吃很少的蛋糕了。

先完成整个项目，然后剔除掉你不要的代码，这就是Dead code elimination。tree-shaking,则是完全相反的一方面，告诉我我要做什么蛋糕，混合的时候需要什么原料。

相比较dead code， 我们推荐live code。从结果来说可能是相同的，但是因为在js中静态分析的限制，就不一样了。live code能获取到更好的结果，而且从表面上看，live code用来解决清楚无用代码的方式更符合逻辑。

一旦发生，rollup并不是最好的。更多的介绍在下面。所以最好的方式是两个都用，rollup打包之后用UglifyJS or Webpack 2 with the Uglify plugin

## Yeah, it’s probably not a great name

首先，他暗示你你确实抖掉了dead branches。但是它被更多的人使用后描述成为从“你所需要的地方开始，向外延伸”，
我在思考一直使用“live code inclusion”这个短语来形容rollup，但是似乎也因此带来了更多的困惑，当我看到tree-shaking这个概念，难道这是一个错误的决定？

## Limits of Rollup’s tree-shaking

Rollup现在根据顶层的ASTnode节点来打包，而不是零碎的层级，所以他包含的代码可能比他需要的更多。
他现在也不能从对象中移除一些没有用到的方法，有时候当我们不得不假设最坏的情况来确保我们的程序正确运行。因为静态词法分析在js这样的动态语言中比较困难。我们将在以后去寻找一些解决办法。

## Rollup is about more than tree-shaking

rollup的目标是生产一个最高效的打包工具，看起来就像是我们写的一样。tree-shaking就是他的一部分，但是rollup还做了别的事情，他不会把函数包裹在一个模块里，他不会将模块加载放在bundle文件的开始，他不会从中间的ast中生成结果代码，但是他会尽可能的保存你的原始代码，因为这是一个很好的机会，即使它不用es6