gpt4 book ai didi

javascript - 在正文标签的末尾渲染阻止Javascript-Firefox渲染一些视觉内容,Chrome不渲染

转载 作者:行者123 更新时间:2023-12-03 07:25:23 25 4
gpt4 key购买 nike

我只是在尝试一些与性能相关的优化。

根据我的理解,任何内联的script都是渲染阻止的,浏览器会在遇到后立即执行它。它还会停止DOM解析。

因此,我希望body末尾的内嵌脚本应阻止渲染,并且浏览器在我解除警报之前不会向我显示任何内容。

Chrome似乎按照上述理解进行渲染,但是Firefox首先渲染html,然后显示警告。

这可能是什么原因?这是否意味着Firefox不考虑将javascript渲染阻止?还是在Chrome和Firefox中呈现其他含义? Firefox是否通过了解脚本接近body的末尾而进行了某种优化?

这是代码:

<html>
<head></head>
<body>
<div>Some Content</div>
<div>Some Content</div>
<div>Some Content</div>
<div>Some Content</div>
<div>Some Content</div>
<div>Some Content</div>
<div>Some Content</div>
<div>Some Content</div>
<div>Some Content</div>
<div>Some Content</div>
<div>Some Content</div>
<div>Some Content</div>
<div>Some Content</div>
<script>
alert('here');
</script>
</body>
</html>

Chrome版本:78
Firefox版本:70

另一个观察结果,如果警报是内联脚本还是外部脚本,则chrome的行为会有所不同。它会阻止内联脚本中的警报,但不会阻止外部脚本中的警报。

更新:跟进问题: render-blocking Javascript at end of body tag - inline vs external script

最佳答案

alert不是用来检查渲染行为的好工具。浏览器使alert及其表亲的阻塞越来越少(不仅仅是Firefox,Chrome也这样做),尽管有很多重叠之处,但它们可能在做不同的事情;您可以了解Chrome的方法here

因此,很明显,Firefox允许继续进行渲染,但在这种特定情况下,Chrome浏览器就不允许这样做。

要检查渲染行为,您需要使用一些不是1990年代以来遗留下来的障碍物。 :-)我使用过的一种方法(尽管不是最近)是加载需要很长时间才能加载的脚本。 (您可以通过让本地服务器使用服务器端代码发送脚本来完成此操作,这会在过程中引入人为延迟。)

关于javascript - 在正文标签的末尾渲染阻止Javascript-Firefox渲染一些视觉内容,Chrome不渲染,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59468048/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com