让JavaScript和其它资源并发下载的方法

在IE6/7里JavaScript会从两个方面阻碍页面呈现：
script标签下面的网页资源在script加载完之前会停止请求、下载。
script标签下面的html元素在script加载完之前会停止渲染。

在ie6/7 firefox2/3 Safari3 Chrome1 和 opera下 script标签会阻碍下载：

虽然在ie8，safari4，chrome2下script可以并发，但依然阻碍了其他资源的下载：

有6种方法可以使script与其他资源并行下载：

1.XHR eval — 通过XHR(XMLHttpRequest 对象)下载script，然后用eval方法执行XHR的responseText
2.XHR Injection — 通过XHR下载script，然后建立一个script标签并把它插入文档中(body或者head标签内),接着把script标签的text属性设置为XHR的responseText的值
3.XHR in Iframe — 把script标签放到一个iframe里，通过iframe下载它
4.Script DOM Element — 创建script标签并把它的src属性指向你的脚本地址
5.Script Defer — 添加script标签的defer属性，这个只在ie中有效，但firefox3.1也支持这个属性了
6.使用document.write方法在页面中写入<script src="">,这个只在ie里有效

可以通过Cuzillion查 看各个方法的使用例子。

如果有一些内联脚本需要在外部脚本执行后才能执行，那就需要同步(synchronize)他们了。称作”coupling”，Coupling Asynchronous Scripts 这篇文章介绍了一些目前可以实现“coupling”的方法。

headjs，能使JS并发下载（但是顺序执行）：http://headjs.com/

代码如下:

head.js("/path/to/jquery.js", "/google/analytics.js", "/js/site.js", function() { 
  // all done 
}); 
  
// the most simple case. load and execute single script without blocking. 
head.js("/path/to/file.js"); 
  
// load a script and execute a function after it has been loaded 
head.js("/path/to/file.js", function() { 
  
}); 
  
// load files in parallel but execute them in sequence 
head.js("file1.js", "file2.js", ... "fileN.js"); 
  
// execute function after all scripts have been loaded 
head.js("file1.js", "file2.js", function() { 
  
}); 
  
// files are loaded in parallel and executed in order they arrive 
head.js("file1.js"); 
head.js("file2.js"); 
head.js("file3.js"); 
  
// the previous can also be written as 
head.js("file1.js").js("file1.js").js("file3.js");

赞 (0)

相关推荐

  • JavaScript多并发问题如何处理

    经常在写代码的时候碰到这样的场景:页面初始化时显示loading页,同时启动多个ajax并发请求获取数据,当每个ajax请求返回时结束loading. 举个例子,一个下订单的页面,要查询常用地址信息.商品信息.地市信息-而这些请求都是异步的,希望等到所有数据加载完成后再允许用户操作. 要实现这个场景容易碰到的一个问题就是多并发怎么控制?下面是一些解决方法和思路: 并行改为串行 如果业务逻辑本身是串行的,但是提供的请求方式又是异步的,可以考虑此方法. 但本场景显然不是这种情况,这样做大大降低了页面

  • Nodejs实战心得之eventproxy模块控制并发

    Nodejs实战心得之eventproxy模块控制并发

    目标 建立一个 lesson4 项目,在其中编写代码. 代码的入口是 app.js,当调用 node app.js 时,它会输出 CNode(https://cnodejs.org/ ) 社区首页的所有主题的标题,链接和第一条评论,以 json 的格式. 输出示例: [ { "title": "[公告]发招聘帖的同学留意一下这里", "href": "http://cnodejs.org/topic/541ed2d05e28155f24

  • 让JavaScript和其它资源并发下载的方法

    让JavaScript和其它资源并发下载的方法

    在IE6/7里JavaScript会从两个方面阻碍页面呈现: script标签下面的网页资源在script加载完之前会停止请求.下载. script标签下面的html元素在script加载完之前会停止渲染. 在ie6/7 firefox2/3 Safari3 Chrome1 和 opera下 script标签会阻碍下载: 虽然在ie8,safari4,chrome2下script可以并发,但依然阻碍了其他资源的下载: 有6种方法可以使script与其他资源并行下载: 1.XHR eval - 通

  • JavaScript 用fetch 实现异步下载文件功能

    废话不多说了,直接给大家贴代码了,具体代码如下所示: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>sample</title> </head> <body> <button id='btn'>下载</button> <span id='status'></span> &

  • javascript实现客户端兼容各浏览器创建csv并下载的方法

    本文实例讲述了javascript实现客户端兼容各浏览器创建csv并下载的方法.分享给大家供大家参考.具体实现方法如下: $("#radarDLBut").click(function(){ var data = [displayData["radar_chart"]["r_label"],displayData["radar_chart"]["r_default"]]; var csvContent =

  • javascript将json格式数组下载为excel表格的方法

    实例如下: <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <script type="text/javascript" src="jquery183.min.js"></script> <script type="text/javasc

  • golang并发下载多个文件的方法

    背景说明 假设有一个分布式文件系统,现需要从该系统中并发下载一部分文件到本地机器. 已知该文件系统的部分节点ip, 以及需要下载的文件fileID列表,并能通过这些信息来拼接下载地址. 其中节点ip列表保存在xx_node.txt, 要下载的fileID保存在xx_fileID.txt中. 代码示例 package main import ( "bufio" "flag" "fmt" "io" "math/rand&

  • python基于gevent实现并发下载器代码实例

    这篇文章主要介绍了python基于gevent实现并发下载器代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 并发下载原理 import gevent from gevent import monkey import urllib.request monkey.patch_all() def my_download(url): print('GET: %s' % url) resp = urllib.request.urlopen(url

  • python 并发下载器实现方法示例

    本文实例讲述了python 并发下载器实现方法.分享给大家供大家参考,具体如下: 并发下载器 并发下载原理 from gevent import monkey import gevent import urllib.request # 有耗时操作时需要 monkey.patch_all() def my_downLoad(url): print('GET: %s' % url) resp = urllib.request.urlopen(url) data = resp.read() print

  • JavaScript使用Promise实现并发请求数限制

    目录 没有Promise的并发请求 使用Promise限制并发请求 使用Promise实现并发请求数限制 总结 没有Promise的并发请求 在Web开发中,我们经常需要发起多个异步请求来获取数据.例如,我们可能需要从服务器获取一些用户信息.文章内容.评论列表等等.如果我们使用的是传统的JavaScript回调函数,可能会写出类似下面这样的代码: function getUsers(callback) { fetch('https://example.com/users', (response)

  • win2008中限制使用迅雷下载的方法[软件策略]

    win2008中限制使用迅雷下载的方法[软件策略]

    这不,巧妙对windows server 2008系统的组策略功能进行深入挖掘,我们可以发现许多安全应用秘密;现在本文就为各位朋友贡献几则这样的安全秘密,希望能对大家有用! 1.限制使用迅雷进行恶意下载 在多人共同使用相同的一台计算机进行工作时,我们肯定不希望普通用户随意使用迅雷工具进行恶意下载,这样不但容易浪费本地系统的磁盘空间资源,而且也会大大消耗本地系统的上网带宽资源.而在windows server 2008系统环境下,限制普通用户随意使用迅雷工具进行恶意下载的方法有很多,例如可以利用w

  • C#实现将javascript文件编译成dll文件的方法

    本文实例讲述了C#实现将javascript文件编译成dll文件的方法.分享给大家供大家参考,具体如下: 第一步:新建项目 添加js文件 写个测试Function (JScript.js) 单击JS文件属性.将 生成操作 改成嵌入的资源 第二步:在项目文件中添加一个类文件  该 类继承System.Web.UI.WebControl类 并重写控件预呈现的方法 代码如下: public class ClientScript:System.Web.UI.WebControls.WebControl

随机推荐