webpack 优化

webpack.wuhaolin.cn/4%E4%BC%98%…

1. 缩小文件搜索范围：include、exclude、resolve.modules、resolve.alias、resolve.extensions、module.noParse
2. DllPlugin 使用动态链接库
3. HappyPack 它把任务分解给多个子进程去并发的执行，子进程处理完后再把结果发送给主进程
4. ParallelUglifyPlugin 并行压缩输出的 JS 代码
5. 代码压缩 UglifyJsPlugin
6. CDN 加速
7. Tree Shaking
8. CommonsChunkPlugin--> splitchunkplugin
9. Prepack：Prepack 通过在编译阶段预先执行了源码得到执行结果，再直接把运行结果输出来以提升性能
10. Scope Hoisting 打包文件更小、运行的更快（函数申明由两个变成了一个） Scope Hoisting 的实现原理其实很简单：分析出模块之间的依赖关系，尽可能的把打散的模块合并到一个函数中去，但前提是不能造成代码冗余。 因此只有那些被引用了一次的模块才能被合并。
11. 按需加载

window.document.getElementById('btn').addEventListener('click', function () {
  // 当按钮被点击后才去加载 show.js 文件，文件加载成功后执行文件导出的函数
  import(/* webpackChunkName: "show" */ './show').then((show) => {
    show('Webpack');
  })
});