Question

我有一个ASP.NET MVC 4应用程序。这引用了一个Js文件：

<script type="text/javascript" src="http://localhost:32967/Scripts/MyScripts/Myscript.js"></script>

下载此脚本时，浏览器中出现阻塞时间。谷歌搜索，我找到了参考here

添加此脚本后，阻止消失了。实际上，添加的脚本引用没有阻塞。这有很大的速度提升。

有人可以解释这个脚本的作用吗？如果这样做可以避免阻塞，那为什么这不是最佳做法？

[更新] 我已将脚本名称从Reference.js更改为MyScript.js，因为它会导致与_reference.js的其他问题混淆。

以下是此文件的内容：

var urls = {
commonUrl: "http://localhost:32944/",
myappurl: "http://localhost:32967/",
productUrl: "http://localhost:49880/"
}

这就是该档案中的所有内容。

问候。

Answer 1

References.js仅为used by the Visual Studio IDE作为提供Intellisense的文件列表。它是不包含在任何HTML文件中作为基本模板的脚本引用，正如我在您的问题中所解释的那样。

如果有的话，添加脚本引用应该减慢加载时间。我在这里走出困境并声称您的测量结果是错误的 - 添加此脚本绝不会加快任何网页的加载时间。

修改：我发现您现在已经更新了您的问题。如果这确实不是_references.js，那么你需要提供文件的内容供我们给出答案。

Answer 2

你问两个问题：

它做了什么？它欺骗了浏览器，认为此HTML页面中没有脚本引用，只有一个内联脚本。通过执行此操作，它可以绕过标准加载过程，从而导致脚本在正常情况下以异步方式加载。为什么这会导致异步加载，您必须询问不同浏览器的实现者。对所有人来说可能并非如此。

为什么不是最佳做法？我可以想到多种原因：

附带副作用
这是一种更详细，更不易阅读的格式
它破坏了HTML标准
它破坏了HTML和其他机器解析HTML

对于＃1：通过异步加载和运行，您无法再控制首先执行哪个脚本。脚本之间可能存在依赖关系，这会在以错误的顺序完成时导致运行时错误。如果你能在异步加载（完全可行）的同时解决按顺序运行的问题，那么你会没事的。

然后，你应该推动浏览器实现者来解决这个问题，而不是实现这个相当丑陋的黑客攻击。还有许多其他更可行的方法来改善页面加载时间。高速缓存，缩小和捆绑是我想到的三个。

最后，我假设您已添加webdigi博客中引用的脚本的工作实现。博客本身擅长解释这个概念，但在代码示例上却很糟糕，因为它没有提供有关命名不佳的变量n，k，e，g和C应该代表什么的见解。这是我正在讨论的参考和上下文的工作实现，它加载了JQuery和JQuery UI。请注意，由于JQuery UI依赖于首先加载的JQuery核心，因此该示例仅在一半的时间内工作：

<html>
    <head>
        <script>
            var headNode = document.getElementsByTagName("HEAD")[0];
            // Jquery
            var c1 = document.createElement("script");
            c1.type= "text/javascript";
            c1.src = "http://code.jquery.com/jquery-2.1.0.min.js";

            // JQuery UI
            var c2 = document.createElement("script");
            c2.type= "text/javascript";
            c2.src = "http://code.jquery.com/ui/1.10.4/jquery-ui.min.js";

            headNode.appendChild(c1);
            headNode.appendChild(c2);
        </script>
    </head>
    <body>
        Content goes here
    </body>
</html>

这个脚本在做什么？

2 个答案: