高性能javascript---笔记1

 

前提：网页中UI和script标签中的代码相互阻塞，script的性能直接影响了页面的渲染，让网页出现性能问题。

一、js  的载入

     1、head 标签后放link引入css，script标签放在body 结束前，这样在页面渲染时，只载入一些样式即可，至于js在页面渲染结束后再载入，不管这个script是外链引入资源的，还是内嵌脚本

    2、js脚本的异步加载。async和defer用于异步加载，采用并行下载，下载过程中不会产生阻塞。

        defer是说明该js与dom无关，会等待页面完成后再执行（兼容性不高），所以他的执行顺序和放置位置无关，都会延迟执行；async则是加载完成自动执行。

    3、脚本的动态加载

         lazyload动态加载多个文件，lab.js可以用来控制代码的加载顺序，可以保证js有关联的代码的串行执行。

二、数据部分

       1、变量的读取速度，字变量和本地变量比数组和对象要快很多。定义变量注意作用域减少使用全局变量。（思考点：作用域的链的改变，with和try catch对作用域的改变）

      2、闭包的使用

           闭包的解释，面试被问到过。JavaScript中的函数会形成闭包。 闭包是由函数以及创建该函数的词法环境组合而成。这个环境包含了这个闭包创建时所能访问的所有局部变量。但是闭包容易造成内存泄漏

function init() {
    var name = "Mozilla"; // name 是一个被 init 创建的局部变量
    function displayName() { // displayName() 是内部函数,一个闭包
        alert(name); // 使用了父函数中声明的变量
    }
    displayName();
}
init();

3、对象成员的读取，减少嵌套层数，就能减少对每层数据的遍历，如果多次使用某个对象，用局部变量对该值进行缓存，也能提升速度