非阻塞Javascript

我想知道是否有可能以不阻止用户体验的方式加载javascript。 我不知道如何实现相同,但我正在寻找一个跨浏览器的解决方案。 我想知道是否有人可以指导我朝着正确的方向前进。 将js放在页面底部不能很好地工作。

感谢您的时间。

Javascript在一个单线程中运行,所以如果你有大量的Javascript调用,那么就像ExtJS这样的librairies一样,它很慢是正常的。 但是,您可以考虑以下替代方案:

首先,尽可能地优化代码。

然后,您可以在Javascript中使用计时器来模拟异步工作。 以下是如何执行此操作的一个很好的示例: http : //ejohn.org/blog/how-javascript-timers-work/

如果您想了解更多信息,请参阅以下有关如何尝试减少Javascript冻结时间的一些其他提示。

http://debuggable.com/posts/run-intense-js-without-freezing-the-browser:480f4dd6-f864-4f72-ae16-41cccbdd56cb

祝好运 !

引用这个答案 :

Javascript资源请求确实是阻塞的,但是有很多方法可以解决这个问题(例如:头脑中注入DOM的脚本标记,以及AJAX请求),而这些问题在我看不到页面的情况下很可能就是这里发生的事情。

包括相同JS资源的多个副本是非常糟糕的,但不一定是致命的,并且是较大的站点的典型,这些站点可能已经从单独团队的工作中累积,或者只是简单的旧编码,计划或维护。

至于雅虎建议将脚本放在正文的底部,这可以提高已经过时的响应时间,并且可以在一定程度上改善实际加载时间(因为所有以前的资源都允许首先异步),但它永远不会那么有效作为非阻塞请求(尽管它们具有很高的技术能力)。

您可以查看有关非阻止Javascript的YUI博客条目。

我相信你可以使用Workers,但它似乎是在FF3.5中实现的,但很少有其他的。

见http://hacks.mozilla.org/2009/07/working-smarter-not-harder/

当页面加载时,它一次只能并行下载2个javascript文件,因此试图保持javascript文件的数量下降并缩小它们的大小(使用Minification,obsfucation和GZipping)将有助于加载体验。

在javascript运行时,在javascript中使用回调也有助于项目无阻塞。

jQuery中的一个例子是

 $('#id').click(function(){ $.post('url',data,function(callbackdata){//do something }); }); 

具有较小延迟的setTimeout将允许您的控制流继续进行,同时安排另一个函数以便稍后执行。 这对于防止UI阻塞或无意中依赖于其他function的成功执行特别有用。

我发现防止javascript错误干扰绑定事件非常有用。 例如,要在表单上安装提交处理程序:

 $('#form').submit(function() { setTimeout(function() { // Submit handler function, ie do an ajax submission of the form $.ajax(...etc...); }, 1); // Return false before the handler executes, ensuring the form won't manually submit // in the event of a js error in the handler return false; }); 

如果您有一些对于立即加载并不重要的JavaScript,则推迟执行JavaScript可能是一个非常好的解决方案。

看看这个jQuery插件 (http://code.google.com/p/funky-jq-plugins/wiki/nonblocking)。

它旨在使用计时器来模拟multithreading环境,其中UI线程不会被要求的操作(如长列表上的迭代)冻结。 很酷的东西……我写的:)

Ciao现在