1

多个内联脚本:

<script type="text/javascript">/* some codeblock 1 */</script>
<script type="text/javascript">/* some codeblock 2 */</script>
<script type="text/javascript">/* some codeblock 3 */</script>

单连体内联脚本:

<script type="text/javascript">
    /* some codeblock 1 */
    /* some codeblock 2 */
    /* some codeblock 3 */
</script>

多个内联脚本更慢吗?

4

3 回答 3

2

如果你说的是在实际的 HTML 中编写代码,而不是加载外部 JS,那么答案是它真的没关系。

...如果浏览器尝试以 60fps 的速度处理视觉刺激请求,并根据需要进行更改... ...那么几微秒的差异不会产生很大的影响。

在非常旧的浏览器上,如果您尝试编写非常多的代码(每个标签可能有数千行,或者每个标签有数万行),那么拥有多个代码可能会产生明显的差异............但是有一个在这种情况下,单个元素仍然会很慢。

于 2012-10-03T01:47:11.643 回答
1

看不到任何可以衡量的方式。

现代浏览器的解析器速度非常快——它们本质上是排序引擎。这个块到 HTML 引擎,这个块到 CSS 引擎,这个块到 JavaScript 引擎 - 这些引擎可能需要一些时间来完成它们的工作,但是将块放到正确的位置根本不是性能问题。

下载一个小页面的性能损失将比收集代码块并将它们送到引擎的性能损失更大。

此外,JavaScript(和许多其他交互语言)通过预处理器运行,在加载和运行时将它们转换为机器代码。现在可能有一个更时髦的名字(可能里面有“云”),但它曾经被称为“即时编译”(JIT)。

这一切都非常复杂,但基本上在页面加载时它只是将它找到的所有脚本发送到这个 JIT 引擎。这个人收集代码,优化它并将其存储在内存中,并将需要立即运行的任何内容传递给执行引擎。随着事物的运行和添加,它会尝试尽可能地简化事物。

因此,对于延迟的代码(例如稍后调用的函数),块的数量根本无关紧要。JIT 编译器将创建忽略块结构的内存优化代码。对于遇到时立即运行的内联代码来说,这并不重要,因为与脚本引擎相关的解析器是如此之快,以至于您在任何合理的情况下都无法看到差异。

也就是说,您可能能够构建一个可能显示出差异的测试用例。但我怀疑你需要进入数千(或数万)块范围才能看到可测量的差异。到那时,其他变量——比如文件大小(每个新的脚本块会在文件大小上增加大约 40 个字节)和渲染时间——将产生巨大的影响,因此您实际上可能永远看不到差异。

底线:编写干净的、文档化的、逻辑的代码,忘记下面的编译器。这将为您节省实际的时间和金钱,而不是给您带来微不足道的、不明显的性能提升。

于 2012-10-03T03:38:18.453 回答
0

我猜单个连体内联脚本稍微快一些

于 2012-10-03T01:27:00.393 回答