当我请求更多.js文件而不是更少时，为什么性能会受到影响呢？

Question

假设我有一个包含十个组件的javacsript文件。确切地说，为什么性能比加载包含每个组件的10个文件更好？好像是相同数量的数据？那有什么区别？

Answer 1

不同之处在于浏览器不会同时加载所有资源。大多数浏览器只打开2-4个并发请求，因此如果您有5个JS文件，浏览器将请求前四个，然后等到其中一个完成后再请求第5个。一些较旧的浏览器一次只请求一个JavaScript文件，并等到它被完全解析后才能获取下一个。

通常，网络时间是用户体验中最糟糕的部分（特别是在世界某些地方或某些设备上），因此拥有一个仅发出一个请求而不是5个请求的捆绑包意味着您的应用会感觉更具响应性。

网上有很多好文章，YSlow是最早的工具之一。用于检查这些内容的指标，但还有其他指标。

Answer 2

简单地说，这不是关于请求的数量的大小，以及它们是否同步或<强>异步

同步编程意味着，除了条件和函数调用之外，代码从上到下依次执行，阻止长时间运行的任务，如网络请求和磁盘I / O.

异步编程意味着引擎在事件循环中运行。当需要阻塞操作时，将启动请求，代码将继续运行而不会阻塞结果。当响应准备就绪时，将触发中断，从而导致运行事件处理程序，控制流继续执行。通过这种方式，单个程序线程可以处理许多并发操作。

正如answer by Cletus所解释的那样：

  

JavaScript始终是同步和单线程的。如果您在页面上执行JavaScript代码块，则当前不会执行该页面上的其他JavaScript。

JavaScript只是异步，因为它可以进行Ajax调用。代码将停止执​​行，直到调用返回（成功或否则），此时回调将同步运行。此时不会运行其他代码。它不会中断当前正在运行的任何其他代码。

这就是为什么在加载更多JavaScript文件时性能会受到影响的原因。