0

这是一个非常基本的问题 - 网页中的脚本和图像是同步加载还是异步加载（例如 ajax 请求中发生了什么）？我正在谈论以常规 html 方式包含图像和脚本 - 和

我只是想知道浏览器如何响应包含相对较大的文件，例如 jQuery（我上次检查时大约 2mb）或其他大型库或大图像，我是否应该担心这会让我的用户在连接到我的网站时卡住几秒钟? 我特别想知道 jQuery 开销，因为我正在考虑将它用于一个小项目......

4

5 回答 5

6

图像是异步加载的，可能是同时加载的。不要理会它们，只要使它们尽可能小并使用 CSS sprites。

脚本被阻塞，即在完成下载前一个脚本之前，您无法加载下一个脚本。这是可以理解的，因为可能存在一些脚本间依赖关系。

您通常所做的是将所有 JavaScript 资源压缩并压缩到一个文件中，该文件包含在页面底部。通过这种方式，页面可以很好地呈现，提供良好的用户体验，并且脚本在最后加载。毕竟，您通常不会在 DOM 就绪事件上更早地运行脚本。

顺便说一句，缩小的 jQuery只有 93K 左右。如果您使用上面的链接，它很可能会一劳永逸地缓存在浏览器中。

于 2012-08-01T13:54:01.873 回答
1

  • 服务器一发送 DOM，浏览器就可以显示网站。

  • 图像是异步加载的，因此大图像在慢速连接上显示缓慢

  • jQuery 是 32kb

  • 脚本一个一个地加载，而不是同时加载

于 2012-08-01T13:54:15.537 回答
1

补充一下，有一些脚本加载库可以同时加载脚本，但仍然确保它们按出现的顺序执行。我使用过并且会推荐的一个是head.js。它提供了一个非常简单的界面（以下是从图书馆网站复制的）：

head.js("/path/to/jquery.js", "/google/analytics.js", "/js/site.js", function() {
   // all done
});

此外，为了澄清关于 jQuery 大小的混淆......从 1.7.2 版开始：

  • 未压缩和未压缩它是275 KB。
  • 缩小为95 KB。
  • 缩小和压缩后大约为34 KB（这是您在 jQuery 网站上看到的值）。

最后一个选项是您实际在生产网站上使用的选项；因此，您不必担心用户需要下载 2 MB 的库。

于 2012-08-01T13:59:01.353 回答
0

脚本块是同步的（但它们可以包含异步代码）
图像加载是异步的

于 2012-08-01T13:54:22.293 回答
-1

我认为 HTML 的正常行为是同步加载所有文件（图像和脚本）。

虽然可以编写一个异步加载文件的小型内联 JavaScript。

于 2012-08-01T13:53:31.373 回答