tooling.report

105 阅读1分钟

image.png

bundlers.tooling.report/

Code Splitting

分离业务代码和第三方库( vendor )

可以充分利用浏览器的缓存来加载这些第三方库实现性能优化。

// webpack.config.js
module.exports = {
  entry: {
    app: './src/main.js',
    vendor: ['vue', 'axios'],
  },
}

** CommonsChunkPlugin合并插件优化**

按需加载(利用 import() 语法)

hashing

参考:github.com/happylindz/…

import modules

transformation

image.png

babel

其他

webpack构建流程

image.png

vite实现原理

zhuanlan.zhihu.com/p/390255972