美文网首页
高性能js+页面加载速度

高性能js+页面加载速度

作者: Liberty寒风 | 来源:发表于2017-07-02 10:28 被阅读0次

    代码运行速度

    不要类型转换

    即开始是什么类型的变量,就让他是什么类型,字符串转数字最好用parseInt.

    不要重新构造对象

    不要在以后再添加属性,最好从一开始定义对象时就确定好属性。

    字符串链接

    +=运算符似乎比+快很多

    限制声明/传递变量的范围(作用域)

    假如你调用一个函数,浏览器必须做一些所谓的范围查找,它的昂贵程度取决于它要查找多少范围。尽量不要依赖全局/高范围的变量,尽量使局部范围变量,并将它们传递给函数。更少的范围查找,更少的牺牲速度。

    页面加载速度

    延迟请求首屏外的文件

    ![](https://img.haomeiwen.com/i4880667/9ed0e27e70d82589.png?imageMogr2/auto-orient/strip)
    

    页面初步加载这张图片的时候是直接以base64的方式(当然你也可以统一使用一张占位图loading.gif来替代)来快速显示一张极小的图片的,而图片本身的真实路径是存在data-src属性内的

    优化页面模块排放顺序

    比如有一个页面是这样的——左边是侧边栏,用于存放用户的头像啊、资料啊,以及网站投放的广告啊,而右侧是文章内容区域:

    <body>
      <sidebar>
        <!-- 侧边栏内容 -->
      </sidebar>
    
      <content>
        <!-- 文章内容 -->
      </content>
    </body>
    

    于是乎,浏览器按照它的UI单线程准则从上到下先加载了侧边栏,再加载我们的文章。。。

    很明显,这样不是一个人性化的加载顺序,我们得弄清楚,页面上各个区域模块,对于用户而言,哪个才是最重要、最应当首先展示的。

    相关文章

      网友评论

          本文标题:高性能js+页面加载速度

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