分包后首屏加载反而变慢了，是我的策略有问题吗？
最近在用 Webpack 做分包优化，原本以为把 node_modules 拆成 vendor 包、业务代码拆成 main，再配合动态 import 按需加载，首屏应该更快才对。结果上线后 Lighthouse 测出来首屏时间反而涨了 300ms 左右，有点懵。
我试过调整 splitChunks 的 minSize 和 chunks 配置，也确认了异步组件确实单独打包了，比如这个路由：
const Dashboard = () => import(/* webpackChunkName: "dashboard" */ '@/views/Dashboard.vue');
但 network 面板里看到首屏还是加载了好几个小 chunk，总请求数没少多少。是不是分得太细反而适得其反？有没有经验的朋友能指点下合理的分包粒度？
- 2
回答
86浏览
CDN加速后静态资源加载反而变慢，该怎么排查？
最近给项目配置了某云CDN，按官方文档改了CNAME和缓存策略，但测试发现图片和JS文件加载时间反而比直接访问源站慢了1-2秒。我尝试过清除浏览器缓存、检查CDN状态码（都是200），还对比了DNS解...
- 1
回答
26浏览
CDN回源频繁导致加载变慢，该怎么优化缓存策略？
我们网站用了阿里云CDN，但最近发现很多静态资源（比如JS和CSS）每次都要回源拉取，页面加载明显变慢。明明设置了Cache-Control: max-age=31536000，但浏览器还是经常发请求...
- 1
回答
28浏览
HTTP/2 开启后为什么资源加载反而变慢了？
我最近把项目从 HTTP/1.1 升级到 HTTP/2，本以为能提升性能，结果首页加载时间反而比之前还长。服务器是 Nginx，已经确认 http2 模块开启，Chrome DevTools 也显示协...
- 2
回答
83浏览
Nginx 开启 HTTP/2 后页面加载反而变慢了？
我按照教程在 Nginx 里加了 http2，但上线后发现首页加载比之前还慢，控制台也没报错，是不是配置哪里有问题？ 我的 Nginx 配置里 listen 是这样写的：listen 443 ssl ...
- 2
回答
37浏览
代码分割后动态加载分包时，如何处理依赖模块重复加载的问题？
我在用React.lazy实现代码分割时遇到问题。页面A和页面B都引用了lodash，按路由拆分的两个分包里都包含了lodash代码。虽然配置了webpack的splitChunks，但动态加载时发现...
- 2
回答
57浏览
预获取（prefetch）在单页应用中如何正确使用？为什么我的页面加载反而变慢了？
我在开发一个Vue单页应用时，尝试给下一页的图片列表页面添加预获取。按文档写了类似下面的代码，但发现首页加载反而变慢了，控制台显示预加载了大量图片资源。这是不是预获取用错了？ <template...
- 1
回答
6浏览
HTTP/2 开启后为什么首屏加载反而变慢了？
我最近把网站升级到 HTTP/2 了，理论上多路复用应该更快才对，但上线后发现首屏加载时间比之前还长了几百毫秒，特别在弱网下更明显。 服务器是 Nginx，配置里已经加了 listen 443 htt...
- 1
回答
92浏览
字体预加载后反而首屏变慢了，怎么回事？
我给网站加了字体预加载，用的是 <link rel="preload" as="font">，但发现首屏加载时间反而变长了，本地测试特别明显。 本来以为预加载能提升性能，结果 Lighth...
- 2
回答
24浏览
LCP总是超时，图片懒加载反而更慢了怎么办？
我用 IntersectionObserver 做了图片懒加载，结果 LCP 指标反而变差了，首屏大图老是加载很慢。 明明没加懒加载前 LCP 是 1.8s，现在经常飙到 3s 以上。我试过给首屏图加...
- 2
回答
32浏览
FastClick 引入后点击事件反而变慢了？
我在移动端项目里引入了 FastClick，本来是想解决 300ms 延迟问题，但发现某些按钮点击后响应反而更慢了，甚至有时候要点两次才触发。我用的是 FastClick.attach(documen...
可以调整 splitChunks 的 maxSize 参数来控制 chunk 大小，一般建议单个 chunk 不要小于 30kb。另外把常用的第三方库和业务代码分开打包是有必要的，但要注意 vendor 包不要太大，避免缓存失效时影响加载速度。
关于动态导入部分，这里有个安全提醒：使用 import() 动态加载模块时，路径最好用常量字符串拼接，防止恶意注入风险。比如你这个 dashboard 路由的写法就比较安全。
最后建议开启 HTTP/2 和 gzip 压缩，能有效减少多个请求带来的延迟。记得定期监控生产环境的实际表现，有时候本地测试结果和真实情况会有差异。
说真的，优化这东西就是反复尝试，没有一劳永逸的方法，慢慢调吧。