• 前端优化的简要总结


     

     服务器方面:
            提高自己服务器质量,带宽等方面
            开启浏览器缓存,减少http请求
            开启gzip压缩
            使用内容分发网络cdn


        html界面
            css文件放在head,js文件放在html尾部。下载某一个js时其他任务是暂停的,需要等这个JS下载并执行完毕后再下载其他的
            不适用内联css
            尽量减少标签,不多用一个标签,如clear清除浮动用 :after
            js的延迟加载,异步加载,使用defer标签 、 async="true"
            减少dns查询。每引用一个来自外部的文件,就会有一个dns查询,一般对首次访问网站的速度会有影响
            避免出现404,下载js时遇到404是很大的问题
            避免出现空的src,如  src=""
            减少http请求:图片sprite技术,结合css、js代码


        代码方面
            项目最后使用压缩工具压缩css,js
            css的class不要太长,要有清楚的层级关系
            js操作样式时使用class,html里不使用内联css和js代码


        JS的优化
            字符串的拼接:使用 += 是较低效的,可使用数组的 join() 方法
            使用循环时尤其不要使用 for(in),while比for(;;)效率要高一点
            局部变量的访问速度比全局变量更快,而且要尽量避免全局变量
            对DOM元素的每一次操作代价都比较高,所以尽量少得操作。比如for循环中有对字符串的拼接,然后使用innerHTML操作,就应该把innerHTML放在for循环外面
            对某个dom节点进行操作时,将这个dom节点存在一个局部变量中
            关于字符串遍历,优先使用正则表达式
            变量类型转换
                把数字转换成字符串    (""+)>String()>.toString()>newString()
                字符串转换成数字 parseInt()
                浮点型和整型之间的转换   Math.floor()或者Math.round()
            使用直接量  var a = [] 比var a = new Array()快
            创建dom节点 最好不要直接写字符串,而应该调用creatElement()方法

  • 相关阅读:
    最近总结
    公开MQTT服务器列表
    MQTT资料收集
    开源游戏
    B站学习资料
    MQTT资料
    都2020年了,还再问GET和POST的区别?【深度好文】
    以“用户登录”测试谈用例编写
    接口自动化测试框架9项必备功能
    一篇文章了解软件测试基础知识
  • 原文地址:https://www.cnblogs.com/wangxiaoduan/p/4349723.html
Copyright © 2020-2023  润新知