Question

我在我的网站上使用jQuery：

<head>
<script src="http://ajax.googleapis.com/.../jquery.min.js" ...></script>
</head>

然后我使用：

$(document).ready(function(){
});

在某些情况下，会使用此事件：

$(document).ready(function(){
    var s = document.createElement("script");
    s.type = "text/javascript";
    s.async = true;
    s.src = "http://www.script-host.com/.../script.js";
    document.getElementsByTagName("head")[0].appendChild(s);
});

现在jquery.js在文件大小方面似乎是我网站上最重的资源之一。因此我想延迟加载jquery.js本身但我明白这会导致所有document.ready事件失败。对此最好的解决方法是什么？

Answer 1

也许最近的这篇文章可能会对您有所帮助：http://samsaffron.com/archive/2012/02/17/stop-paying-your-jquery-tax

背后的想法是创建一个临时的$函数，在其中收集要在domready事件中执行的所有函数，然后在页面底部加载jQuery时将其替换。 / p>

Answer 2

您可以在页面底部加载jQuery，而不是<head>。它仍将使用带宽，但它应该在视觉上更快。

如何懒惰加载jQuery本身，特别是在使用$（document）.ready（）时

2 个答案: