webpack-dev-server加载bundle需要很长时间。

Question

webpack-dev-server 大约需要一分钟的时间来重新加载网页应用。bundle.js 是4mb左右--我知道这很大，但是从本地服务器加载的，应该不会花这么长时间吧？另外这不是重新编译的时间。只是重新加载而已。所以，即使什么都没改，我只是在浏览器中触发刷新，加载捆绑包也需要一分钟的时间。

这可能是什么原因？还是平时就是这样操作的？甚至如何排除这样的故障，在 webpack-dev-server? 我想找到瓶颈所在。

Answer 1

首先回答实际问题----------------------------------。是的 - 这就是它需要多长时间来加载文件的大小 通过HTTP。而我们对此无能为力。如果有人有任何想法，如何加速实际的加载过程（没有缓存），让我知道在评论。

TL;DR

目前我所知道的唯一的解决方案是...。缓存. 但你需要确保你缓存的东西是正确的。

随机的东西，可能会变成一个解决方案。

我个人在设置上有两个疏漏。虽然微不足道，但绝对是至关重要的检查修正。

请注意。 下面的内容只有在你分码的情况下才有意义--第三方的lib如果没有改变，应该和你正在处理的文件分开加载（下面会有更多的内容）。

1. 我已经禁用了打开devtools的缓存。我不记得为什么一开始就启用了这个功能，完全忘了我是这么做的。所以事实证明这是一个非常糟糕的主意。确保你没有启用该功能（确保该复选框被选中）。未勾选！）。).

2. 另一个很大的问题是，我使用的VSCode，特别是 VSCode的Chrome调试器插件 默认禁用了缓存。于是，在调试模式下的web-app开始突然加载缓慢。好消息是，有一个选项可以将其恢复。disableNetworkCache (真正 默认情况下)

即使你进行了缓存，如果你的捆绑包很大，最终缓存会失效，你将不得不在新鲜版本加载时等待，除非你使用了 分码 来将该bundle分割成几个独立的片段，会在不同的时间失效，即使会失效，也会比一个大dump加载的快很多。

个人经验的建议

首先，如果你出于某种原因，还停留在传统的 CRA 如果你需要升级，基本上每隔一个月你就会花上一个月的时间不升级，反正升级程序已经迫在眉睫，除非你不打算再在这个项目上工作。

如果你的项目已经到了升级根本不可行的阶段，因为更新的模块和插件带有新的要求，可能与你项目中的文件不兼容，你将不得不退出。这可能听起来很疯狂，但最终可能会减少痛苦，然后尝试不这样做。