0

一整天我都在阅读和评论延迟加载 JavaScript 的内容,但什么也没有。我尝试使用 defer/async 属性和 deferredfunctions.js(?)。我应该用它做什么以及把它放在哪里?对不起我的无知。

这是我的代码:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script>
<script src="http://mysite.com/files/js/mosaic.1.0.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(function($){     $('.fade').mosaic();});</script>
4

1 回答 1

2

这个问题有点太广泛了,无法正确回答。异步/延迟加载javascript代码和使用脚本加载应该有很多不同的原因。

为什么要延迟加载它?出于同样的原因,您应该将所有<script>标签放在 HTML 标记的最底部。<script>元素确实阻止了浏览器 HTML 渲染器的执行。当<script>遇到一个元素时,HTML 解析器将在继续之前停止并加载+评估该脚本文件。这可能会对页面加载时间产生或多或少的巨大性能影响(取决于您的 javascript 文件的数量和大小)。

这就是为什么你应该用和/或属性标记你的<script>元素的原因。如果浏览器理解这些属性(几乎每个现代浏览器都会这样做),它不会停止,而是异步加载和评估资源。asyncdeferr

您现在可能会说“顺序和依赖关系怎么样”,这将是一个有效且好的论点。如果您为允许异步加载它们的浏览器标记所有脚本,则不再保证顺序,如果脚本依赖于其他脚本的存在,这是一个大问题。这是像requireJS这样的第三方脚本加载器出现的地方。

于 2012-12-02T20:29:19.510 回答