前端如何进行页面优化

html

• 语义化
• 加载顺序:css放head里面(用户看到顺畅页面)，js放尾部（会阻塞dom渲染，且dom树没搭建好时，js里面的dom操作会有问题）
• 减少页面请求：合并img,合并css，避免使用@import方式引入css文件
• 减少文件大小（1.主要减少img文件大小，选用合适的格式并且用工具进行压缩(ImageOptim,ImageAlpha,JPEGmini)，2.删除不必要的标签）

css

• 选择器：越简单越短越好,同样的样式进行选择器合并
• css值缩写：margin等，值为0的省略单位,
• 减少文件大小:YUI Compressor,cssmin
• 少用耗性能的属性:expresion,border-radius,filter,box-shadow,gradients等
• 图片设置宽高，不要缩放，减少浏览器的回流和重绘。
• 所有表现用css实现
• 模块化
• 命名规范、语义化
• 尽量减少hack

javascript

• 页面懒加载
• 少用dom操作