3

我的页面上有以下代码：

<script src="/Scripts/common/layout/addAccessControls.js"></script>
<script src="/Scripts/common/layout/addAjaxControls.js"></script>
<script src="/Scripts/common/layout/addBodyControls.js"></script>
<script src="/Scripts/common/layout/addContentControls.js"></script>
<script src="/Scripts/common/layout/addThemeControls.js"></script>
<script src="/Scripts/common/layout/hashClick.js"></script>
<script src="/Scripts/common/layout/setSideBar.js"></script>

所有脚本将一个接一个地加载是否正确？如果是这样，有没有一种方法可以一次进行多个负载？

只是为了稍微澄清一下这个问题。我可以缩小这些并连接它们，也许它们已经被模拟和连接了:-) 我很想知道的是给定这些确切文件的加载过程。是不是一个接一个的文件。浏览器是否对并行加载做任何事情。谢谢

4

10 回答 10

3

嗯，第一个问题是脚本是一个接一个地加载的。第二个问题是请求的数量。请求越多，花费的时间就越长。

最简单的方法是将服务器端的文件连接到一个.js文件中，这样您就只剩下一个请求了。这将加快速度。

如果您另外缩小脚本，这也会加快速度。

根据您在服务器端使用的框架，有多种解决方案来解决此问题。例如，对于 Node.js，您可以使用Piler在运行时执行此操作。

或者，当然，您始终可以手动执行此操作，分别通过构建作业。

PS：当然，您可以使用其他机制来加载脚本文件，例如动态添加脚本标签，这将允许您并行加载。有关详细信息，请参阅http://blogs.msdn.com/b/kristoffer/archive/2006/12/22/loading-javascript-files-in-parallel.aspx。

于 2012-09-27T11:05:57.907 回答
3

您可以使用async命令（HTML5）：

<script async src="slow.js"></script>

动态脚本加载：

var script = document.createElement("script");
script.async = false;
script.src = url;
document.head.appendChild(script);

HTML5 异步脚本

于 2012-09-27T11:13:50.083 回答
1

是的，它们将一个接一个地加载和执行。而你无法改变这一点。

但是，如果您关心性能，您可能会很高兴得知下载过程是不同的，并且可能会被浏览器并行化。

您可以通过打开Chrome Developer Tools 的网络选项卡在 Chrome 中查看它。

如果您想减少总时间，最好的解决方案是将所有文件连接成一个（并尽可能缩小它们，但重要的操作是连接）。

于 2012-09-27T11:04:32.323 回答
1

您可以使用这样的工具连接和缩小它们。如果您有 Mac，甚至还有一个很棒的应用程序可以自动执行此过程，称为CodeKit

于 2012-09-27T11:06:19.527 回答
1

这是脚本阻塞。它是一个浏览器功能。不同的浏览器并行下载不同数量的文件。脚本将依次加载和执行。您可以阅读 Steve Souders 和 Nicolas Zakas 的这些文章。这可以帮助你。

http://www.stevesouders.com/blog/2009/04/27/loading-scripts-without-blocking/ http://www.nczonline.net/blog/2009/06/23/loading-javascript-without-阻塞/

于 2012-09-27T11:13:59.293 回答
0

您可以在将文件推送到生产环境时合并文件以获得单个文件[并最小化它们]...这样您将保存请求手动检查和中间的所有步骤...

于 2012-09-27T11:09:08.533 回答
0

根据浏览器和正在下载的其他文件（例如图像）的数量，您可能会按照放置顺序同时下载多个 JavaScript 文件。

您可以通过使用 Firebug 或 Chrome 的开发者工具看到这种情况。您会注意到您的浏览器总是会加载多个文件，但同时下载的最大数量因浏览器和使用的版本而异。

于 2012-09-27T11:07:09.807 回答
0

如果您的问题与标题有关（如何减少我的 javascripts 的加载时间？），一个好的方法是

  • 检查代码，在必要时删除和优化
  • 连接所有文件（按加载顺序）
  • 缩小代码
  • 使用 gzip 压缩提供单个文件
  • 利用缓存来避免不必要的请求
于 2012-09-27T11:07:15.587 回答
0

根据浏览器的不同，将并行加载不同数量的文件。它们应该并行执行，但为了获得最佳结果，请将事件处理程序附加到页面，例如onload.

如果文件不通过减少服务器往返而改变，则连接文件将缩短加载时间。您还可以尝试使用缓存清单或使用 AJAX 延迟加载第三级脚本。

于 2012-09-27T11:07:35.763 回答
0

您可以尝试使用这种技术，以适合您现有的代码...

1. Use minify version of JS code
2. Add only one external JS file (copy all content to one)
3. Use cookie less domain
于 2012-09-27T11:07:38.490 回答