web性能优化

HTML

  • 尽量给图片加上宽高,减少页面重绘,防止图片缩放
  • 用link而不是@import样式倒入
  • css样式放页头 js放页尾
  • 缩小favicon.ico并缓存

CSS

  • 避免使用css表达式 background-color:expression(xxx)
  • 减少查询层级:如.header .logo要好过.header .top .logo
  • 减少查询范围:如.header>li要好过.header li

Javascript尽量少用全局变量;

  • 使用事件代理绑定事件,如将事件绑定在body上进行代理;

  • 避免频繁操作DOM节点;

  • 减少对象查找,如a.b.c.d这种查找方式非常耗性能,尽可能把它定义在变量里;

  • 类型转换:把数字转换成字符串使用"" + 1,浮点数转换成整型使用Math.floor()或者Math.round();

  • 对字符串进行循环操作,譬如替换、查找,应使用正则表达式;

  • 删除重复的JS

其他

  • 尽量合并css和js文件,减少http请求
  • 使用gzip压缩内容
  • 使用cdn服务 使服务离用户最近
  • 减少cookie大小 使用无cookie域 胡苦短请求静态文件时,减少cookie对域名的影响
  • 文件头指定Expires 是内容具有缓存

你可能感兴趣的:(web性能优化)