使用 ajax 的并行页面加载答案

【问题标题】：Parallel page loading using ajax使用 ajax 的并行页面加载
【发布时间】：2014-11-09 04:19:02
【问题描述】：

假设我有一个包含四个块的页面。每个块都包含大量的 html 代码。加载整个页面需要很长时间，尤其是在 ie8 等旧浏览器中。我可以使用 ajax 请求加速页面加载吗？我的意思是发送 ajax 请求以获取页面的每个部分。有人告诉我，ajax 请求并行工作而不是单线程页面渲染，这就是为什么它有助于减少页面加载时间的原因。这是真的吗？

【问题讨论】：

不确定但不认为它是这样工作的，因为 ajax 在 DOM 加载之后加载，所以它会再次请求更多的东西.. 也许某种 ajax 延迟加载会起作用
它可能会更慢。 IE8 的渲染引擎，特别是在需要重新绘制（即扩展宽度表）的大型 html 上非常慢。如果可以的话，尝试在你的块/单元格上设置硬像素宽度，因为它会提高 ie8 的绘画能力。
你也可以使用，但不支持ie8 & 9。stackoverflow.com/questions/30036/javascript-and-threads
@vico 我可以在 DOM 加载之前启动 AJAX 请求，不是吗？
您的页面需要等待服务器响应、加载数据，然后一次再重复该过程 4 次。您可以设置一个演示来轻松测试这一点，然后只需查看网络日志，看看与正常负载相比，时间是否有所改善。（响应延迟可以是 500 毫秒到 2.5 秒，具体取决于服务器及其正在处理的内容）

标签： javascript html render

【解决方案1】：

javascript 上的所有 I/O 操作都是并行运行的，您只需启动所有操作并等待所有操作完成，promises（也称为 jQuery 上的 Deferreds）就是为此而设计的，使用 .当。示例：

$.when(
  $.get("/resource1"),
  $.get("/resource2"),
  $.get("/resource3")
).done(function(response1, response2, response3) {
  // do things with response1, response2 and response3;
});

【讨论】：

对提高页面加载速度有帮助吗？
如果您正在使用 ajax，并且页面加载涉及使用 ajax 请求，那么建议以这种方式发出 ajax 请求以减少等待时间但是使用 ajax 请求本身而不是让浏览器执行作业并没有改善页面加载时间，事实上，我建议让浏览器在可能的地方/尽可能地完成这项工作