网站性能优化整理
1.尽量减少请求数
提取公用CSS，模块化，其他的合并。Javascript也一样(可以避免页面加载阻塞)。
对页面上的小图标，背景等图片进行合并，减少请求次数。
2.减少页面体积
压缩JS
3.CSS&HTML的重构
CSS选择器不能太长，禁止使用ID选择器和!important
4.延迟加载
通常应用于图片比较多的网页，如果一个页面图片比较多，且页面高度或宽度有好几屏，页面初次加载时，只显示可视区域的图片，当页面滚动的时候，图片进入了可视区域再进行加载，这样可以显著的提高页面的加载速度，更少的图片并发请求数也可以减轻服务器的压力。如果用户仅仅在首屏停留，还可以节省流量。如果TAB中的图片较多，也同样可以应用于TAB中，当触发TAB时再进行图片的加载。
原理：将图片的先用一个1*1的占位图片代替(如果占位图片能设置成真实图片的宽高是最好的)真实地址缓存在一个自定义的属性(lazy-src)中，
等到进入可视区(或距离可视区域一定范围)时，将占位图片的src换掉，真实图片开始加载。
|
优化方向 |
优化手段 |
|
请求数量 |
合并脚本和样式表，CSS Sprites，拆分初始化负载，划分主域 |
|
请求带宽 |
开启GZip，精简JavaScript，移除重复脚本，图像优化 |
|
缓存利用 |
使用CDN，使用外部JavaScript和CSS，添加Expires头，减少DNS查找，配置ETag，使AjaX可缓存 |
|
页面结构 |
将样式表放在顶部，将脚本放在底部，尽早刷新文档的输出 |
|
代码校验 |
避免CSS表达式，避免重定向 |
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
