【前端】前端性能分析与优化

性能分析

一文从零彻底搞懂前端的内存监控、异常、泄漏

今天,搞定Chrome运行时的性能、内存问题 [太实用了]

性能优化

【原】雅虎前端优化的35条军规

1.尽量减少HTTP请求数
2.减少DNS查找
3.避免重定向
4.让Ajax可缓存
5.延迟加载组件
6.预加载组件
7.减少DOM元素的数量
8.跨域分离组件
9.尽量少用iframe
10.杜绝404
11.避免使用CSS表达式
12.选择<link>舍弃@import
13.避免使用滤镜
14.把样式表放在顶部
15.去除重复脚本
16.尽量减少DOM访问
17.用智能的事件处理器
18.把脚本放在底部
19.把JavaScript和CSS放到外面
20.压缩JavaScript和CSS
21.优化图片
22.优化CSS Sprite
23.不要用HTML缩放图片
24.用小的可缓存的favicon.ico（P.S. 收藏夹图标）
25.给Cookie减肥
26.把组件放在不含cookie的域下
27.保证所有组件都小于25K
28.把组件打包到一个复合文档里
29.Gzip组件
30.避免图片src属性为空
31.配置ETags
32.对Ajax用GET请求
33.尽早清空缓冲区
34.使用CDN（内容分发网络）
35.添上Expires或者Cache-Control HTTP头

推荐阅读

当谈及 Web 性能优化时，我们该关注哪些性能指标

从宏观到细节为你讲解前端性能优化

聊一聊前端性能与体验的优化

(1.6w字)浏览器与前端性能灵魂之问，请问你能接得住几个？

解读新一代 Web 性能体验和质量指标

Chrome 运行时性能瓶颈分析

万字长文！总结Vue 性能优化方式及原理

本文作者： ionluo
本文链接： http://www.ionluo.cn/blog/posts/dd85c073.html
版权声明： 本作品采用 知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议 进行许可。转载请注明出处！