1 <!-- 前端性能优化
2 从用户访问资源到资源完整的展现在用户的面前的过程中,通过技术手段和优化策略,缩短每个步骤的处理时间从而提升整个资源的访问和呈现速度,网站的性能直接回影响到用户的数量,所有前端性能优化很重要。
3
4 前端性能优化分为如下几个方面:
5
6 1、代码部署
7 a、代码的压缩与合并
8 b、图片、js、css等静态资源使用和主站不同域名地址存储,从而使得在传输资源时不会带上不必要的cookie信息
9 c、使用内容分发网络 CDN
10 d、为文件设置last-modified、expires和etag
11 e、使用GZIP压缩传输
12 f、权衡DNS查找次数(使用不同的域名会增加DNS查找)
13 g、避免不必要的重定向(加"/")
14 2、编码
15 HTML:
16 a、使用结构清晰,简单,语义化标签
17 b、避免空的src和href
18 c、不要再HTML中缩放图片
19 css:
20 a 精简css选择器
21 b 把css放到顶部
22 c 避免@import方式引入
23 d css中使用base64图片数据取代图片文件,减少请求次数,在线转base64网站
24 e 使用css动画取代JavaScript动画、
25 f 使用字体图标
26 g 使用css sprite(雪碧图)
27 h 使用svg图形
28 i 避免使用css表达式
29 j 避免使用css滤镜
30 JavaScript:
31 a 减少引用库的数量
32 b 使用requirejs或seajs异步加载js
33 c js放到页面底部引入
34 d 避免全局查找
35 e 使用原生方法
36 f 使用switch代替复杂的if else语句
37 g 减少语句数,比如多个变量申明可以写成一句
38 h 使用字母量表达式来初始化数组或对象
39 i 使用innerHTML代替复杂元素注入
40 j 使用事件代理(事件委托)
41 k 避免多次访问dom选择集
42 l 高频触发事件设置使用节流函数
43 m 使用web storage缓存数据 -->