模块化一小步，编译的一大步

Dear 丶 2022-10-02 14:45 120阅读 0赞

**前言：当 webpack 编译性能优化做到极限的时候，我们应该跳出webpack编译优化的陷阱。因为编译本来就存在瓶颈。**

**（拿我司vue项目来说）**：  
当项目中的vue文件，从1到1000的时候，甚至还在一天天增多，如何维护好他们确实是一门学问，因为随之而来的编译速度，时时刻刻不在浪费我们团队中每个人的生命。

**项目启动 和 hotReload 编译 速度**：

项目启动速度需要 ：50秒 左右

hotReload 编译速度需要： 15秒 左右

**你还敢相信webpack能帮你解决编译性能的问题吗？致命的问题是它没办法帮你解决掉文件的数量，所以webpack编译本身已经成为了瓶颈。**

所以我想到了一个解决方案：模块化 （这里模块化概念是指：按照后台菜单模块来拆分，把（页面vue文件 和 路由router.js）维护在一起）

其实模块化，可以按照其它（业务、功能）等维度来划分。

![337731-20190530134442306-1545624740.png][]

**选择模块化理由**： 一个大项目本来就是由多个人同时开发维护，开发人员各自只需关心自己模块下写的页面代码。(举个栗子：把 a - w 字母当作模块化的概念，如果我这次开发涉及到 a、b 2个模块，其实 c-w 模块压根是你不需要关心的模块），我们其实可以按需编译**。** 我猜想了一下如果按照模块化的思路，如果只针对本次修改的模块进行编译，是不是编译的瓶颈就解决了，顺着这个思路，我实践了模块化的按需编译，实践证明是没问题的

**模块化方案，如图所示**：

![337731-20190530135311452-1063998314.png][]

**别看模块化一小步，编译性能一大步** ：

最终，项目启动速度由：50秒  \-> 9秒

最终，hotReload编译速度由：15秒  \-> 1秒

转载于:https://www.cnblogs.com/Kummy/p/10949170.html

[337731-20190530134442306-1545624740.png]: /images/20220109/82f619bf663042c295540912cb1fd92d.png
[337731-20190530135311452-1063998314.png]: /images/20220109/29bd8e5efb5149abad35614338eeef82.png

发表评论取消回复

表情：

评论列表（有 0 条评论，120人围观）

还没有评论，来说两句吧...

相关阅读

相关个人网站一步一步搭建——（17）简历模块

后面的模块都比较简单前面的N多练习都做过了 ![797834-20190730184239175-2108509577.png][]

Bertha 。/ 2023年10月11日 13:12/ 0 赞/ 52 阅读

相关模块化一小步，编译的一大步

前言：当 webpack 编译性能优化做到极限的时候，我们应该跳出webpack编译优化的陷阱。因为编译本来就存在瓶颈。（拿我司vue项目来说）：当项目中的vu

Dear 丶/ 2022年10月02日 14:45/ 0 赞/ 121 阅读

相关一步一步走进Docker

Docker基础 Docker命令启动 sudo service docker start 查看镜像 docker images 查看当前镜像 docker

ゝ一纸荒年。/ 2022年09月30日 10:55/ 0 赞/ 308 阅读

相关一步一步配置source insight

自从老大让用source insight以来，慢慢的喜欢上了这个功能强大的代码编辑器。下面是我一步一步配置source insight的过程，给后来人分享一下：一、让sou

超、凢脫俗/ 2022年08月06日 07:26/ 0 赞/ 341 阅读

相关 Android ActionBar 一步一步分析

1.Action Bar 介绍我们能在应用中看见的actionbar一般就是下图的样子，比如快图应用 ![20130502103745486][] 1.App icon

た入场券/ 2022年08月02日 06:54/ 0 赞/ 273 阅读

相关一步一步地配置Spring

本文旨在从一个空工程一步一步地配置Spring，空工程见上一篇文章[创建Maven父子工程][Maven]。 \\一、spring基本配置 \\\1. 添加spring依赖

亦凉/ 2022年07月24日 08:17/ 0 赞/ 352 阅读

相关一步一步学springboot 一

[Spring Boot][]是由[Pivotal][]团队提供的全新框架，其设计目的是用来简化新Spring应用的初始搭建以及开发过程。该框架使用了特定的方式来进行配置，从而

谁借莪１个温暖的怀抱￠/ 2022年06月17日 10:22/ 0 赞/ 393 阅读

相关一步一步创建一个spring cloud多模块工程

最近项目要用spring boot ，spring cloud 还有docker，在spring cloud这卡了很久，这篇博文做个笔记 1、因为项目是多模块的，这里需要建

Bertha 。/ 2022年04月14日 03:49/ 0 赞/ 263 阅读

相关架构的“一小步”，业务的一大步

前言：谈到“架构”这两个字，会有好多的名词闪现，比如:分层架构、事件驱动架构、DDD、CQRS等。亦或者一堆的软件设计原则，如：KISS原则（Keep it Simpl

川长思鸟来/ 2022年03月08日 14:18/ 0 赞/ 196 阅读

相关一步一步手写promise[一]

开始之前，假设你对promise有个大致的了解，或者快速读一下[Promise A+ 规范][Promise A_],过一下即可，对promise熟练使用，那直接跳过吧。可以边

深藏阁楼爱情的钟/ 2022年02月17日 06:43/ 0 赞/ 418 阅读