pc端的性能优化

pc端性能优化

一、页面优化的常用工具

1、Firbug + Yslow + pagespeed
2、webpage test www.webpagetest.org
3、DynaTrace 查看javascript  cpu  占用等
4、Firbug net Panel
5、Chrome Developer Tools
6、IE9开发者工具
7、HTTPwatch

网站慢的因素很多

1、不同浏览器原因 - 客观
2、DNS原因 - 客观
3、地域问题 - 客观
4、页面html结构和布局
5、图片太多 太胖
6、http请求数太多
7、javascript 太胖
8、服务器端处理太差
9、网络原因
10、。。。。

二、网站优化

①、页面优化
②、服务器端优化
③、“主观”优化

1、页面优化

1、减少http请求次数
2、减少交互通信量
3、合理并行加载资源
4、减少消耗

2、服务器端优化

1、CDN
2、缓存
3、Gzip
4、减少DNS
5、响应速度

3、主观优化

1、目录优化
2、内容优化
3、体验优化
4、SEO

①减少http请求次数

1.合并能合并的文件
2.sprites(CSS,img)
    紧凑的排列图片，颜色相似放在一起，不要留有空白，以减少体积，加快显示速度
3.删除重复脚本
    浏览器不会忽略重复脚本，会再执行一次
4.Src值不能为空

②减少交互通信量

1.压缩技术(JS,CSS,img,cookie)
  CSS/JS--减少空白，增强逻辑性，用缩写方式，压缩
  IMG—png8，压缩图片，不缩放图片
2.缓存技术(JS,CSS,ajax)
3.减少不必要通信
  推迟加载（懒加载）/预加载
  用GET方式进行AJAX请求
  静态内容无cookie(如图片等)
4.优化DOM结构，降低信噪比
5、JS压缩与格式化  http://tool.chinaz.com/Tools/JsFormat.aspx
   css压缩与格式化 http://tool.chinaz.com/Tools/CssFormat.aspx
   图片压缩  ：  图床 

③合理并行加载资源

1.尽量避免重定向
2.慎用iframe
  不被搜索引擎识别，空的iframe加载时会阻止内容加载
3.CSS置于顶JS置于样式后
  JS阻塞加载
4.分域
  综合并行加载数，注意加载资源项的域名书写

④减少消耗

1.避免使用CSS表达式

（expression方法。计算频度太高）
2.避免使用滤镜
　　（问题在于：代码维护量大，冻结浏览器，增加客户内存占用）
3.减少DOM访问
　 （ JS访问DOM是很慢的，重新渲染）

三、对于pc端的性能优化的其他说法

1、对于页面：采用最优布局方式；优化DOM结构；减少iframe使用；推迟加载；预加载；

2、对于CSS：把样式表置于顶部：避免使用CSS表达式（Expression）；避免使用滤镜；使用外部CSS；削减CSS；合并压缩；

3、对于Javascript：把脚本置于页面底部；使用外部JavaScript；削减JavaScript；剔除重复脚本；减少DOM访问；延迟执行；合并压缩；

4、对于图片Img：PNG8；JPG；优化压缩；CSSsprites；IMGsprites；推迟加载；预加载；

推荐网站：

1、http://code.google.com/intl/zh-CN/speed/page-speed/docs/payload.html
   PageSpeed
   
2、http://www.xiaohanseo.com/201004153.html
   必须要了解的三个SEO基础知识

3、http://www.jb51.net/yunying/35105.html
   优化DNS解析和拆分域名 让网站打开速度更快技巧
   
4、http://www.cnblogs.com/wildweeds/archive/2010/06/12/web_performance.html
   [汇总]Web前端优化