美文网首页
前端如何进行页面优化

前端如何进行页面优化

作者: xiao_333 | 来源:发表于2017-08-14 17:11 被阅读0次

    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操作

    相关文章

      网友评论

          本文标题:前端如何进行页面优化

          本文链接:https://www.haomeiwen.com/subject/ejnurxtx.html