优化
专注应用全链路优化疑问，解答性能、代码、资源与体验优化中的各类优化问题。
-
2
回答
50浏览
虚拟列表滚动时为什么会出现白屏闪烁？
我在用 React 实现虚拟列表时，快速滚动经常看到白屏一闪，体验很糟糕。明明已经按可视区域渲染了，数据量也不大（大概 1000 条）。 我试过用 React.memo 包裹子项，也加了 key，但问...
-
2
回答
35浏览
关键CSS提取后样式错乱怎么办？
我用 Webpack 的 mini-css-extract-plugin 把关键 CSS 单独抽出来了，但首页加载时布局直接崩了，字体、间距全不对。 明明在 <head> 里内联了关键 C...
-
2
回答
41浏览
位运算能优化CSS类名切换吗？
最近在做性能优化，看到有人说用位运算管理状态比直接操作 classList 更快。我试了下，但不确定是不是真的有效，或者有没有坑。比如我现在有个按钮要切换 active 状态，原本是这样写的： .bt...
-
2
回答
45浏览
CDN自动转WebP不生效，是配置问题还是浏览器兼容问题？
我们网站用的是阿里云CDN，已经开启了“自动将图片转为WebP”功能，但实际测试发现有些图片还是返回的原格式（比如.jpg）。我用Chrome DevTools看请求头，Accept里确实有image...
-
1
回答
29浏览
预加载资源提示到底该怎么用才有效？
我最近在优化首屏加载速度，听说用 <link rel="preload"> 能提前加载关键资源，但试了之后发现浏览器根本不按预期加载，甚至有时候还报 warning 说资源没被使用。 比如...
-
1
回答
32浏览
Service Worker 缓存策略怎么和 Vue 路由配合？
我用 Vue 做了个单页应用，加了 Service Worker 做缓存，但发现页面刷新后有时会卡在旧版本，尤其是切换路由后再刷新。是不是缓存策略没配对？ 我试过在 sw.js 里用 CacheFir...
-
2
回答
41浏览
PerformanceObserver 监听不到首次 paint 事件怎么办？
我在用 PerformanceObserver 监控 FP 和 FCP，但页面加载后 observer 回调根本没触发，是不是我写法有问题？ 已经确认浏览器支持，也把 entryTypes 写对了，但...
-
2
回答
39浏览
虚拟滚动列表高度计算不准怎么办？
我在用 React 实现虚拟滚动时，发现列表项高度不一致，用了 react-window 的 VariableSizeList，但滚动过程中经常出现空白或内容错位。是不是我哪里没设置对？ 我试过在 i...
-
1
回答
28浏览
Android上input输入框聚焦后页面布局错乱怎么办？
我在做一个移动端表单页面，iOS 上一切正常，但在 Android 手机（比如三星、小米）上点击 input 输入框时，页面会突然往上顶，底部导航栏被顶出视野，甚至有些元素错位。试过加 viewpor...
-
2
回答
33浏览
Webpack打包后体积太大，怎么有效压缩JS和CSS？
我们项目用的是 Webpack 5 + React，最近发现首屏加载特别慢，看了下打包后的 main.js 居然有 2.3MB（未压缩）。我已经开了 mode: 'production'，也试过用 T...
-
2
回答
38浏览
智能预加载怎么判断用户下一步要访问哪个页面？
最近在做 React 项目性能优化，想实现“智能预加载”——比如用户在首页滚动到某个区域时，就提前加载商品详情页的资源。但我发现很难准确预测用户下一步会点哪里，目前只是简单地在 hover 时 pre...
-
2
回答
43浏览
字体加载太慢怎么优化？本地字体文件反而更卡了？
我用的是自定义中文字体，直接从 Google Fonts 引入特别慢，就改成把 woff2 文件下载到本地用 @font-face 引入，结果页面首次打开时文字还是空白好几秒，甚至比在线加载还卡，这是...
-
2
回答
54浏览
防抖和节流到底该用哪个？搜索框输入请求老是发太多次
我在做一个搜索功能，用户每输入一个字就触发一次请求，结果服务器压力太大了。我试过用防抖，但有时候用户打字快，反而搜不到中间结果；换成节流又感觉响应太慢。到底该怎么选？ 这是我的搜索框结构： <i...
-
2
回答
40浏览
IgnorePlugin 配置后为啥没生效？
我在用 Webpack 的 IgnorePlugin 时，明明配置了忽略 moment 的 locale，但打包体积还是很大，好像没起作用。 我这样配的： new webpack.IgnorePlug...
-
1
回答
54浏览
作用域优化时变量提升到底该怎么处理？
我在重构一个老项目，想通过作用域优化减少全局变量污染。但发现把函数内部的变量用 let 提前声明后，有些逻辑反而报错了，比如访问不到之前在 if 块里定义的变量。 我试过把所有变量都提到函数顶部用 l...
-
2
回答
22浏览
图片懒加载时占位图怎么处理才不抖动？
我在做图片懒加载，想用占位图避免布局抖动，但实际效果还是会有跳动，是不是我宽高没设对？ 试过给 img 加固定宽高，也试过用背景色占位，但图片加载完还是会“闪一下”或者把下面内容顶下去。是我哪里没考虑...
-
1
回答
54浏览
Vue 项目中动态导入组件为啥没生效？
我用 Vue 3 做了个后台系统，想对路由组件做 code splitting，但打包后发现所有组件还是被打进一个 chunk 里了，根本没拆分。是不是写法有问题？ 我试过用 () => imp...
-
2
回答
50浏览
前端接口失败重试怎么做才不会重复请求？
我在做用户登录功能，网络不稳定时想加个重试机制，但发现有时候会连续发好几次一样的请求，比如用户点一次登录，结果因为重试发了三次。我试过用 axios 的拦截器加 retry 逻辑，但没控制好并发。 现...
-
2
回答
31浏览
如何限制并发请求的数量避免浏览器卡死？
我有个页面要批量上传几十个文件，直接用 Promise.all 发起请求，结果浏览器直接卡住了，甚至报错“Too many connections”。 试过自己写了个队列控制，但逻辑有点乱，比如下面这...
-
1
回答
21浏览
Tree Shaking 为什么没把我的 Vue 组件里没用的函数删掉？
我用 Vite + Vue 3 开发，发现打包后一些没引用的工具函数还在 bundle 里。明明开启了 Tree Shaking，是不是因为 sideEffects 配置不对？ 比如下面这个组件，只用...
