11 2020 档案
摘要：对于现在的前端项目而言，编译发布几乎是必需操作，有的编译只需要几秒钟，快如闪电，有的却需要10分钟，甚至更多，慢如蜗牛。特别是线上热修复时，分秒必争，响应速度直接影响了用户体验，用户不会有耐心等那么长时间，让你慢慢编译；如果涉及到支付操作，产品损失更是以秒计，每提前哪怕一秒钟发布，在腾讯海量用户面前
阅读全文
摘要：推荐先阅读 webpack 入门教程之后再来阅读本文。 Webpack 4 和单页应用入门 手摸手，带你用合理的姿势使用 webpack4 （上） 本文为手摸手使用 webpack4（下），主要分为两部分： 怎么合理的运用浏览器缓存 怎么构建可靠的持久化缓存 #默认分包策略 webpack 4 最大
阅读全文
摘要：利用 Webpack 来优化 Web 性能属于加载性能优化 的一部分： ☛ Web Performance Optimization with webpack 本文目录： 减少前端资源体积 使用长期缓存 监控和分析应用程序 总结 一、减少前端资源体积 1、webpack 4 开启 productio
阅读全文
摘要：默认值 开箱即用的 SplitChunksPlugin 应该对大多数用户都很好用。 默认情况下，它只影响随需应变的块，因为更改初始块会影响运行项目时包含的应有脚本标记 HTML 文件。 webpack 将根据以下条件自动分割块: 新块可被共享的，或者来自 node_modules 文件夹 新块将大于
阅读全文
摘要：之前接手的一个旧项目，使用的是roadhog + dva + antd等技术，里面大概有上百个路由文件，其他model、组件等文件也不少，导致整个项目的模块文件非常多，热更新和打包都速度都比较慢，输出代码体积也很大。基于这个问题，本文整理webpack常用的一些优化手段。 <!--more--> 参
阅读全文
摘要：近来厂里的项目越来越多，代码共享必不可少。我现在采取的方案是： 把公共组件拿出来，开一个新仓库 使用 webpack 进行打包编译，libraryTarget: 'umd' 将打包编译的代码一起提交到仓库 使用 npm i <owner>/<repo> -S 安装依赖，因为我厂的仓库均为私有，所以不
阅读全文
摘要：提取公共js代码 前言 项目中我们常遇到项目中有多个入口文件的情况，这时候如果有两个入口文件引用了相同的模块，这时候如果我们没有做任何处理的话，在打包时就会把这个相同的模块打包两次，这样既影响了性能，又降低了我们的代码质量，本文就介绍一种解决该现象的插件，来提取公共的js代码。 条件 该方法只适用于
阅读全文