非阻塞Javascript
我想知道是否有可能以不阻止用户体验的方式加载javascript。 我不知道如何实现相同,但我正在寻找一个跨浏览器的解决方案。 我想知道是否有人可以指导我朝着正确的方向前进。 将js放在页面底部不能很好地工作。
感谢您的时间。
Javascript在一个单线程中运行,所以如果你有大量的Javascript调用,那么就像ExtJS这样的librairies一样,它很慢是正常的。 但是,您可以考虑以下替代方案:
首先,尽可能地优化代码。
然后,您可以在Javascript中使用计时器来模拟异步工作。 以下是如何执行此操作的一个很好的示例: http : //ejohn.org/blog/how-javascript-timers-work/
如果您想了解更多信息,请参阅以下有关如何尝试减少Javascript冻结时间的一些其他提示。
祝好运 !
引用这个答案 :
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现在