• 《高性能Javascript》 Summary(一)


     

    第一章、加载和执行 Loading & Execution

    原因:Javascript 的执行导致页面渲染中止等待。

    解决:

    1. script放在页面底部,紧靠body 闭合标签之前,保证页面在script执行之前渲染完成。
    2. script成组打包,减少script的请求数量。
    3. 非阻塞的方式加载script。(设置defer属性;动态创建script标签;使用xhr下载脚本注入到页面)


    第二章、数据访问 Date Access

    原因 Javascript中,数据存储位置可以对代码整体兴能产生重大影响。有四种数据访问类型:直接量,变量,数组项,对象成员。直接量和变量访问快,数组项和对象访问慢。

    解决:

    1. 避免使用with语句改变上下文执行环境,应该适当小心的使用try catchcatch子句,他有同样的效果。
    2. 嵌套对象成员会造成重要性能影响,尽量少用
    3. 一个属性或方法在原型链位置越深,访问速度越慢。
    4. 访问局部变量快。将经常使用的对象成员,数组项和域外变量存入局部变量中。

     

    第三章、DOM编程 DOM Scripting

    原因:DOMJavascript(ECMAScript)实现保持相互独立。两者就像两座岛屿,ECMAScript每次访问DOM时,都会交上一次‘过桥费’,访问越多,交得越多。

    解决:

    1. 最小化DOM的访问,在Javascript端尽量做更多的事情。
    2. 将反复使用的地方使用局部变量存放DOM引用
    3. 小心处理HTML集合(访问慢,总是对底层文档进行查询),将Length缓存到变量中,在迭代中使用这个变量。如果经常操作html集合,可以将集合拷贝到数组中使用
    4. 如果可以的话使用更快的API,如querySelectorAll and firstElementChild
    5. 注意重绘和重排:批量修改style, 离线操作dom树,缓存并减少对布局信息的访问。
    6. 动画中使用绝对定位(脱离文档流,不影响文档流的dom重绘重排),使用拖放代理。
    7. 使用事件委托技术最小化事件句柄数量。

    《高性能Javascript》  Summary(二)

     

  • 相关阅读:
    永无乡「HNOI2012」
    ruby基础知识之 class&module
    Linux命令集锦
    Ruby知识总结-一般变量+操作符+if+数组和哈希
    VMware通过VMnet8共享本地网络
    VMware Workstation 不可恢复错误 (vcpu-0)
    WIN10安装时msxml4.0提示2502、2503解决办法
    C# 委托知识总结
    request.servervariables参数
    判断MS SQLSERVER临时表是否存在
  • 原文地址:https://www.cnblogs.com/zzd0916/p/10968512.html
Copyright © 2020-2023  润新知