Question

我一整天都在阅读和评论Defer加载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>

Answer 1

这个问题有点过于宽泛，无法正确回答。加载javascript代码 asyncronously / deferred 并使用脚本加载应该有很多不同的原因。

为什么要加载它延期？出于同样的原因，您应该将所有<script>标记放在HTML标记的最底部。 <script>个元素会阻止浏览器HTML渲染器的执行。遇到<script>个元素时，HTML解析器将停止并加载+评估该脚本文件，然后再继续。这可能会对页面加载时间产生或多或少的巨大影响（取决于javascript文件的数量和大小）。

这就是您应该使用<script>和/或async属性标记deferr元素的原因。如果浏览器理解这些属性（几乎每个现代浏览器都这样做），它就不会停止，而是异步加载和评估资源。

您现在可能会说，“关于订单和依赖项”，这将是一个有效且好的参数。如果您标记允许浏览器同步加载它们的所有脚本，则不再保证顺序，如果脚本依赖于其他脚本的存在，这是一个大问题。这就是 requireJS 等第三方脚本加载器进入舞台的地步。

推迟加载JavaScript（3个文件）

1 个答案: