高性能JavaScript:加载和执行
创始人
2024-07-21 11:21:24
0

       在步入正题之前为大家介绍一本很好的书《高性能JavaScript》大家不妨看一下,在本文中我为大家分享我看这本书的一些收获。

推荐的书

阻塞特性
       JS 有个很无语的阻塞特性,就是当浏览器在执行JS 代码时,不能同时做其他任何事情,无论其代码是内嵌的还是外部的。

脚本位置:
       浏览器在碰到一个引入外部JS 文件的  

  •  
  •  
  •  
  •  
  • 组织脚本:
           为了改善上面的阻塞情况,应尽可能的减少页面中    

  •     
  •  
  • 无阻塞的脚本:
    为了阻塞状况,这里提供了几个实现并行下载JS 脚本的方案。

    1. 延迟的脚本

           HTML4 为 

    2. 动态脚本元素
           这是最通用的解决方案,通过DOM 动态地创建    

  •  
  • load_script('file1.js', function()  
  •  {     
  •    load_script('file2.js', function()  
  •      {        
  •       load_script('file3.js', functio()  {                   
  • //全部载入后的操作...           
  •          } );  
  •       } );  
  •   } );  
  •   
  • 3.XMLHttpRequest 脚本注入

           即通过AJAX 方式加载,不过这种方式无法实现跨域加载,不适用于大型网站。

    推荐的无阻塞模式
           我们上面做的这些工作当然也已经被那些牛人们完成了,并写成了一些优秀的JS 类库以便我们使用,它们均能很好地解决JS 脚本的阻塞问题,实现并行下载,例如: YUI3、LazyLoad、LABjs 等。
     

    【编辑推荐】

    1. JavaScript跨域总结与解决办法
    2. 使用Javascript开发移动应用程序
    3. 10个令人惊奇的HTML5和JavaScript效果
    4. JavaScript初学者应注意的七个细节

    相关内容

    热门资讯

    如何允许远程连接到MySQL数... [[277004]]【51CTO.com快译】默认情况下,MySQL服务器仅侦听来自localhos...
    如何利用交换机和端口设置来管理... 在网络管理中,总是有些人让管理员头疼。下面我们就将介绍一下一个网管员利用交换机以及端口设置等来进行D...
    施耐德电气数据中心整体解决方案... 近日,全球能效管理专家施耐德电气正式启动大型体验活动“能效中国行——2012卡车巡展”,作为该活动的...
    20个非常棒的扁平设计免费资源 Apple设备的平面图标PSD免费平板UI 平板UI套件24平图标Freen平板UI套件PSD径向平...
    德国电信门户网站可实时显示全球... 德国电信周三推出一个门户网站,直观地实时提供其安装在全球各地的传感器网络检测到的网络攻击状况。该网站...
    为啥国人偏爱 Mybatis,... 关于 SQL 和 ORM 的争论,永远都不会终止,我也一直在思考这个问题。昨天又跟群里的小伙伴进行...
    《非诚勿扰》红人闫凤娇被曝厕所... 【51CTO.com 综合消息360安全专家提醒说,“闫凤娇”、“非诚勿扰”已经被黑客盯上成为了“木...
    2012年第四季度互联网状况报... [[71653]]  北京时间4月25日消息,据国外媒体报道,全球知名的云平台公司Akamai Te...