Javascript 浏览器是否在单个线程中执行加载的脚本？_Javascript_Html_Performance_Asynchronous

Javascript 浏览器是否在单个线程中执行加载的脚本？

javascript html performance asynchronous

Javascript 浏览器是否在单个线程中执行加载的脚本？,javascript,html,performance,asynchronous,Javascript,Html,Performance,Asynchronous,我可以写以下内容： <script src="file1.js" defer></script> <script src="file2.js" defer></script> <script src="file3.js" defer></script> 如果我对性能提升感兴趣，第二个块的执行速度能更快吗？在我看来，如果浏览器在一个线程中执行所有JavaScript，那么3个脚本的总执行时间与第一个块没有什么不同，只是执行顺

我可以写以下内容：

<script src="file1.js" defer></script>
<script src="file2.js" defer></script>
<script src="file3.js" defer></script>

如果我对性能提升感兴趣，第二个块的执行速度能更快吗？在我看来，如果浏览器在一个线程中执行所有JavaScript，那么3个脚本的总执行时间与第一个块没有什么不同，只是执行顺序可能不同。我说得对吗

如果我对性能提升感兴趣，第二个块的执行速度能更快吗

由于脚本将被异步下载和执行，是的，这将减少页面加载时间

作者比较了包含脚本的三种方法：注入脚本、阻塞脚本和具有

async

属性的脚本。结果是：

                    script execution   onload  
 ----------------- ------------------ -------- 
  script-injected   ~3.7s              ~3.7s   
  blocking script   ~2.7s              ~2.7s   
  async attribute   ~1.7s              ~2.7s

如您所见，

async

属性提供了最佳性能。如果脚本的执行顺序不重要，您一定要使用它

关于你的标题问题：

浏览器是否在单个线程中执行加载的脚本

是的，因为JavaScript是单线程的，但就性能而言并不重要。下载脚本比实际执行脚本花费的时间要长得多，因此您应该专注于优化下载部分

我做了个测试。我创建了一个简单的脚本：

for (var i = 0; i < 1e8; i++);

test2.html

：

<!DOCTYPE html>
<script src="test1.js"></script>
<script src="test2.js"></script>

<!DOCTYPE html>
<script src="test1.js" async></script>
<script src="test2.js" async></script>

然后，我在浏览器中打开了这些HTML文件，并在Chrome DevTools中选中了Timeline选项卡：

test1.html

：

<!DOCTYPE html>
<script src="test1.js"></script>
<script src="test2.js"></script>

<!DOCTYPE html>
<script src="test1.js" async></script>
<script src="test2.js" async></script>

test2.html

：

<!DOCTYPE html>
<script src="test1.js"></script>
<script src="test2.js"></script>

<!DOCTYPE html>
<script src="test1.js" async></script>
<script src="test2.js" async></script>

如您所见，在这两种情况下，脚本都不是异步执行的

另请参见：.

必须测试一些东西吗？我认为这两种方法的总体执行时间相同，但在

async

方法中，我们可以更快地显示HTML等重要数据。这完全是我的意见。谢谢，但问题是关于执行时间的。从我所看到的，执行时间不受我是否使用

defer

或

async

的影响。使用

async

加载时间确实更好。如果不使用async，浏览器将等待第一个脚本执行，然后再执行第二个脚本。-如果它只有一个线程来执行脚本，那么它将如何处理

async

这是我问题的重点。谢谢，这基本上证明了总执行时间不会随着

async

属性的引入而改变，并且等于每个脚本的执行时间之和，对吗？