推测解析

传统上，浏览器的 HTML 解析器运行于主线程之中，并且在遇到 </script> 标签后会被阻塞，直到脚本从网络中被获取和执行。Firefox 4 和后续的版本支持从主线程中分离的推测解析技术。在下载和执行脚本时，它会提前进行解析。HTML 解析器会对在数据流中提前找到的脚本、样式表和图片启动推测加载，并推测运行 HTML 树构建算法。这样做的好处是，当推测成功时，就无需重新解析已扫描过脚本、样式表和图像的传入文件部分。缺点是，当推测失败时，会损失更多的工作。

这篇文档旨在帮助你避免推测失败和页面加载变慢。

要想成功加载链接脚本、样式表和图片，请避免 document.write。如果你使用 <base> 元素重载页面的基 URI，将这个元素放置到文档的非脚本部分。不要通过 document.write() 或者 document.createElement 添加。

避免树构建器的输出丢失

当 document.write() 改变了文档树的状态，以至于当 document.write() 插入的所有内容都被解析后，</script> 标记后的推测状态不再保持时，推测树生成失败。然而，只有不寻常地使用 document.write() 才会产生问题。这些事情需要避免：

  • 不要写不对称的文档树。<script>document.write("<div>");</script> 很糟糕。<script>document.write("<div></div>");</script> 则是可行的。
  • 不要写未完成的标识。<script>document.write("<div></div");</script> 很糟糕。
  • 不要以回车结束内容。<script>document.write("Hello World!\r");</script> 很糟糕。<script>document.write("Hello World!\n");</script> 则是可行的。
  • 需要注意的是，对称的标签也可能导致文档的不对称。比如：head 元素中的 <script>document.write("<div></div>");</script> 会被解析成 <script>document.write("</head><body><div></div>");</script>，因此文档是不对称的。
  • 不要仅格式化部分表格。<table><script>document.write("<tr><td>Hello World!</td></tr>");</script></table> 很糟糕。