优化webpack打包速度方案
基本原理要么不进行打包;要么缓存文件,不进行打包;要么加快打包速度。
不进行打包方案:
1,能够用CDN处理的用CDN处理,比如项目引入的第三方依赖jquery.js,百度编辑器
先进行打包或者缓存然后引入到项目中不进行打包的
1,采用webpack插件:webpack.DllReferencePlugin ,将线上需要使用的包提前打包,引入到项目中
加快打包速度的方案
1,webpack-parallel-uglify-plugin 并行压缩
2,启用loader缓存比如babel-loader
{
test: /\.js$/,
loader: 'babel-loader?cacheDirectory=true',
include: [resolve('src'),resolve('test'), resolve('node_modules/webpack-dev-server/client')]
}
以上是目前项目中采用的,还有尝试性的方案
1,使用fast-sass-loader代替sass-laoder
2,减少webpack的寻址路径
3,使用模块化方案引入模块功能
4,升级webpack
5,升级node.js
6,使用cache-loader
优化webpack打包速度方案的更多相关文章
- 优化Webpack打包速度
1. Webpack 可以配置 externals 来将依赖的库指向全局变量,从而不再打包这个库,比如对于这样一个文件: import React from 'react'; console.lo ...
- 提升webpack打包速度
webpack打包文件体积过大,怎么提升速度? 借助webpack visualizer可视化插件,来看构建的情况.这个问题要具体情况具体分析,看看打包文件有哪些块头比较大,哪些不常改变,最好列一个l ...
- webpack打包速度和性能再次优化
一. 改单dll为双dll 因为上图原因,使用CommonsChunkPlugin时,导致其打包出来的vendors.js内的模块ID会因为其他文件引用模块数量的变化而变化. 所以现利用DllPlug ...
- 解决webpack打包速度慢的解决办法
技巧1 webpack在打包的时候第一次总是会做很长的准备工作,包括加载插件之类的.在刚接触webpack的时候总是webpack一下-测一下-改一下-再webpack一下,这种方式最后让很多人崩溃了 ...
- Webpack 打包优化之速度篇
在前文 Webpack 打包优化之体积篇中,对如何减小 Webpack 打包体积,做了些探讨:当然,那些法子对于打包速度的提升,也是大有裨益.然而,打包速度之于开发体验和及时构建,相当重要:所以有必要 ...
- webpack打包性能分析
1. 如何定位webpack打包速度慢的原因 首先需要定位webpack打包速度慢的原因,才能因地制宜采取合适的方案,我们可以在终端输入: webpack --profile --json > ...
- Webpack 打包太慢? 试试 Dllplugin
webpack在build包的时候,有时候会遇到打包时间很长的问题,这里提供了一个解决方案,让打包如丝般顺滑~ 1. 介绍 在用 Webpack 打包的时候,对于一些不经常更新的第三方库,比如 rea ...
- webpack 打包优化的四种方法(多进程打包,多进程压缩,资源 CDN,动态 polyfill)
如今,webpack 毫无疑问是前端构建领域里最耀眼的一颗星,无论你前端走哪条路线,都需要有很强的webpack 知识.webpack 的基本用法这里就不展开讲了.主要探讨一下如何提高 webpack ...
- Webpack 打包优化之体积篇
谈及如今欣欣向荣的前端圈,不仅有各类框架百花齐放,如Vue, React, Angular等等,就打包工具而言,发展也是如火如荼,百家争鸣:从早期的王者Browserify, Grunt,到后来赢得宝 ...
随机推荐
- Phoenix的jdbc封装
一.Phoenix版本 <dependency> <groupId>org.apache.phoenix</groupId> <artifactId>p ...
- 16.Listener(监听器)
/*监听器*/ java的事件监听机制(主要是对一些web元素的监听 (ServletContext(计时器),HttpSession和ServletRequest)) 1.事件监听涉及到三个组件:事 ...
- IDEA 社区版集成TOMCAT
直接在POM.XML中添加以下内容 <plugin> <groupId>org.apache.tomcat.maven</groupId> <ar ...
- MySQL无法启动:ERROR 2002 (HY000): Can't connect to local MySQL server through socket '/var/lib/mysql/mysql.sock' (2)
1 详细异常 ct 11 17:31:51 bd02.getngo.com mysqld[20513]: 2019-10-11T09:31:51.187848Z 0 [Note] /usr/sbin/ ...
- Matlab[linux]安装问题
OS : Arch Linux 桌面:Gnome X11 软件是从网上下载的iso文件,对文件挂载或者使用解压软件解压,我个人更喜欢挂载,解压有点麻烦(我比较懒) 软件:matlab(R2016) 开 ...
- subs函数
matlab中subs()是符号计算函数,表示将符号表达式中的某些符号变量替换为指定的新的变量,常用调用方式为: subs(S,OLD,NEW) 表示将符号表达式S中的符号变量OLD替换为新的值NEW ...
- class文件与dex文件解析
关于Android的热修复与插件化技术在如今基本上已经成为了“时髦技术”的标配了,或者说用来进行“炫技”的一种方式,毕境如今Android已经发展得非常之成熟了,基本上APP用的到东东都差不多,除了业 ...
- Python&Selenium自动化测试之PO设计模式
一.摘要 Page Object模式,后面简称PO,他是一种设计思想,在上一章节中,曾经列举了一些在编写自动化测试过程中随着代码量的增加导致的大量代码难以维护.难以扩展.可读性极差等灾难性的事件:那么 ...
- Python&Selenium借助html-testRunner生成自动化测试报告
一.摘要 本博文将介绍Python和Selenium进行自动化测试时,借助html-testRunner 生成自动化测试报告 安装命令:pip install html-testRunner 二.测试 ...
- Python的安装和配置(windowns 双版本)
1.去官网上下载python,注意版本. 官网地址:https://www.python.org/downloads/windows 2.下载安装版或者zip包都可以.安装就按向导一步一步完成即可.z ...