File tree Expand file tree Collapse file tree 1 file changed +28
-0
lines changed Expand file tree Collapse file tree 1 file changed +28
-0
lines changed Original file line number Diff line number Diff line change
1
+ ## 通用优化
2
+ 1 . 减少HTTP请求数量。HTTP 1.x 会有当请求数量过多时阻塞
3
+ 2 . 减少DNS查询
4
+ 3 . 避免重定向
5
+ 4 . 静态资源尽量都要加上缓存
6
+ 5 . 懒加载
7
+ 6 . 预加载
8
+ 7 . 减少dom数量, 避免使用table的布局, 避免使用iframe
9
+ 8 . 静态资源和服务请求划分到不同的域名,能减少cookie的传输
10
+ 9 . 使用CDN,降低网络延迟和提升稳定性
11
+ 10 . 开启gzip降低文件体积,但是图片和PDF这类压缩过的就不要使用
12
+ 11 . 避免img出现空src
13
+ 12 . 减少cookie体积
14
+ 14 . 尽可能早的引入css外链,但是要保持在内联的script之后
15
+ 15 . 多使用transform的能利用GPU计算的属性
16
+ 16 . script尽量放在body底部,不要阻塞html的渲染,合理使用defer 和 async
17
+ 17 . 压缩css、js 并且 进行bundle analyzer,移除重复的包
18
+ 18 . 减少dom操作
19
+ 19 . 图片使用雪碧图、使用webp这些更加高效的图片类型
20
+ 20 . React合理使用memo 和 useCallback
21
+ 21 . React减少state、redux-store
22
+ 22 . React.lazy 和 suspend, 动态import 分bundle,减少收评需要加载资源
23
+ 23 . 将一些不容易变的东西,缓存到本地,渲染页面时用作state默认值, 等接口请回来时再覆盖state渲染
24
+ 24 . webpack会按照顺序打包,要将请求尽可能提前。而不是放在index.tsx的useEffect中请求,尽量放在最顶部
25
+ 25 . React框架的html插槽中,可以预先填入部分结构,在React渲染完挂载后覆盖插槽
26
+ 26 . 采用SSR,但是要注意流量控制,防止高QPS的活动压爆服务。项目上线前注意压测
27
+ 27 . 骨架屏
28
+
You can’t perform that action at this time.
0 commit comments