一、精简 HTML 代码
减少 HTML 的嵌套
减少 DOM 节点数
减少无语义代码(比如:
清除浮动)删除 http 或者 https,如果 URL 的协议头和当前页面的协议头一致的,或者此 URL 在多个协议头都是可用的,则可以考虑删除协议头
删除多余的空格、换行符、缩进和不必要的注释
省略冗余的标签和属性
使用相对路径的 URL
二、提升 CSS 渲染性能
谨慎使用 expensive 属性,如:nth-child 伪类;position: fixed 定位
尽量减少样式层级数,如:div ul li span i {color: blue;}
尽量避免使用占用过多 CPU 和内存的属性,如:text-indent: -99999px;
尽量避免使用 CSS 表达式,如:background-color: expression((new Date()).getHours()%2 ? “#FFF”:”#000”);
尽量避免使用通配选择器,如:body>a {font-weight: bold;}
三、提升 CSS 文件加载性能
- 使用外链的 CSS
- 尽量避免使用 @import
四、怎样才能减少浏览器的回流和重绘
CSS
避免过多样式嵌套
避免使用 CSS 表达式
使用绝对定位,使动画元素脱离文档流
避免使用 table 布局
尽量不使用 float 布局
图片组好设置好 width 和 height
尽量简化浏览器不必要的任务,减少页面重新布局
使用 Viewport 设置屏幕缩放级别
避免频繁设置样式,最好把心 style 属性设置完成后,进行一次性更改