前台页面速度优化标准

1. Css文件 

1.1 Css引用应该放在<head>标签中,并保证每个页面引用唯一的css 

1.2 避免1个频道所有页面公用1个css文件,以免发生公用class过多难以修改和删除

造成的css不断增大以及小页面引用超大css的问题  

2. Javascript 

2.1 将js引用和执行放在页面尽量靠下的位置 

2.2 Javascript函数、判断、循环要封装到js中,html中只允许简单的函数调用 

2.3 Javascript代码执行效率的优化(足够优化的代码执行速度和CPU使用能有10倍甚至

更高的降低) 

2.4 同一页面,特定参数需要运行的js,只在特定参数的情况下运行 

 

3. Html 

3.1 尽可能的减少div嵌套,合理的应用dt dd li等元素 3.2 使整体的html代码量尽量的小,在和同行业同页面相比无特殊功能和区块的情况下,

总字节数不可高于同行业同页面的10% 3.3 巨大的包含数据的html(如产品下拉框),数据应封装到js中减少html代码量并充

分利用缓存 

3.4 虽然html要减少,但为了SEO链接仍然要使用绝对路径 3.5 尽量减少使用iframe 3.6 禁用ViewState 3.7 禁用asp.net控件 

 4. Cookie,由于Cookie会随着每次http请求往返于服务器和客户浏览器之间,增加网络

流量开销,降低网友访问速度 4.1 Cookie要尽量少用。 

4.2 使用的时候要使Cookie尽量的小 

4.3 设定Cookie过期时间要尽量的短且合理 

4.4 将Cookie精准的写在使用它的2级域名下,尽可能的不去写根域的Cookie 

4.5 样式、js、图片等不需要Cookie的文件分离到不携带Cookie的域名上,如

ico.pcpop.com.cn  img.pcpop.com.cn 

 

5. 减少前台http请求数量 

5.1 页面http总请求数量不应高于最优竞争对手的同页面的10% 

5.2 最大化的css sprite 合并样式小图,每页面调用样式图片的总数不超过3个 5.3 尽量将零散的js合并,“页面自用”的js总数控制在5个以内(1个jquery或其他工

具引用、1个公用js、1个页面专用js、2个其他功能js) 

5.4 尽量减少页面ajax的请求次数,将功能相近可以合并的ajax请求合并 

 

6. 缓存优化 

6.1 “所有可以缓存的资源”都必须在HttpHead中对过期时间进行设置 

6.2 Ajax要特别注意对是否可缓存的资源区分,可缓存的ajax请求的get参数中要加入

正确的时间戳以便CDN可以正确缓存 

6.3 不能缓存的ajax接口应从可被CDN缓存的域名中分离出来。


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章