在您的 html 中包含大量脚本标签是不是存在任何性能问题？

Posted 2023-03-15

【中文标题】在您的 html 中包含大量脚本标签是不是存在任何性能问题？

【英文标题】：Are there any performance issues in having a large number of script tags in your html?在您的 html 中包含大量脚本标签是否存在任何性能问题？

【发布时间】：2011-01-14 22:02:13

【问题描述】：

在 html 文件中有大量（比如 50 个）脚本标签是否存在任何问题。是否会导致页面呈现时间出现任何性能问题？

我的页面上有一个部分用于提取地理定位点并将其放入一个数组中以在谷歌地图上使用。我可以只为地理位置点创建一个单独的查询，但我相信如果我在请求其他内容时将其提取出来会更有效。

<script type="text/javascript">points[count] = [job_latitude,job_longitude,'title'];</script>

【参考方案1】：

当浏览器遇到SCRIPT 元素时，它会停止解析和呈现 HTML，并开始解析和解释其内容。这是因为代码SCRIPT 元素可能会改变已经解析的DOM 树。

这就是为什么it’s recommended to put SCRIPTs at the bottom of the document所以整个文档正文已经被解析的原因。

所以我宁愿完全请求地理位置（也许您可以在服务器端收集它们并在最后打印它们）。或者，如果您不能或不想这样做，请将 defer attribute 添加到您的 SCRIPT 元素中，以告诉解析器不要等待脚本。

【参考方案2】：

LABjs 是一个轻量级 .js 文件（MIT 许可），它允许您的脚本与标记并行加载 - 它有可能显着缩短页面加载时间 - 但要小心使用等待（ ) 函数来确保尊重依赖关系。