
Webpack
sanye丶
一个前端
展开
-
Webpack中的网页性能优化(Preloding/Prefetching)
怎么做优化?一般都会想到利用缓存来进行性能优化,既出来第一次加载模块的时候耗费性能,其它时候使用这个模块的时候,都使用第一次加载留下来的缓存,但其实利用缓存能优化的性能非常小。但是一般来说,代码覆盖率高的页面的性能会更好,什么是代码覆盖率?既这个页面的js代码有用的代码除于页面加载的总代码得到的一个数值。在浏览器F12打开控制台,然后ctrl + shift + p,在弹出的输入框里输入Sh...原创 2020-04-19 22:30:16 · 264 阅读 · 0 评论 -
Webpack中使用babel转译ES6
安装必要包npm install --save babel-loader babel-core babel-preset-envbabel-loader:一个loader,主要是给webpack和babel作为桥梁进行通讯的。babel-core:babel核心库。babel-preset-env:把ES6语法转换为ES5。使用module: { rules: [ {...原创 2020-04-19 15:42:50 · 363 阅读 · 0 评论 -
Webpack的SplitChunkPlugin插件解析
什么是SplitChunkPlugin?说到SplitChunkPlugin就不得不提Code Splitting(代码分割),Code Splitting顾名思义就是对你的代码进行分割,为什么要对代码进行分割?主要是为了优化网站的性能,举个例子:当你的页面只有一个js文件,它有10M大小,那么当用户访问你的页面的时候,就要要一次用一个请求加载10M大小的文件;而当你使用了代码分割,把这个js...原创 2020-04-19 14:53:06 · 1347 阅读 · 0 评论