问为什么我的javascript包下载起来这么慢？

EN

1：“将我所有的库连接到一个文件中是错误的吗？”

这里没有正确和错误的答案，它在很大程度上取决于捆绑包中的内容，以及它的使用方式(所以我假设您通常关心加载速度)。一些想法：

一般来说，合并和缩小JS、CSS总是一个好主意(图像应该合并到sprites中)。更少的字节将传输更快，更少的请求产生更少的开销，哦，它的成本更低。但是..。

• 当你说“我所有的库”时，你是不是包括了通过公共CDN可用的库？如果是这样，我会考虑使用这些替代方案。有一个合理的机会，最终用户已经有一个给定的文件从大型/信任的CDN，如谷歌，如果他们没有，它将被快速下载，并行于您的网站加载，并且不会对您造成任何成本。(如果你的安全意识，这可能是不能接受的依赖于第三方托管所需的库-但这是一个潜在的巨大节省加载时间的权衡-取决于你的including).
• Browsers限制每个主机名请求的库(所以它取决于你发出的请求总数)，所以使用多个子域/域/cdn来加载你的资产是有意义的(根据你组合的库的数量和使用频率，将其保持在1到2个额外的domains).
• Depending，只在需要它们的页面上加载特定的库可能是有意义的(你甚至可以在不需要它们的页面上懒惰地加载它们，所以它们已经被缓存了，但不要阻碍呈现其他页面)。只在单个页面上需要的脚本可以合理地移动到超文本标记语言或单独的脚本文件中，并将提高平均页面加载速度。

2：“为什么在我的情况下，下载~1mb几乎需要10秒？”

你自己说的--“本地环境……总是加载得很快”。你的问题是数据必须传输的距离，而不是它的包装有多好。在本地主机上运行几乎是瞬间的，无论你加载多少脚本，通过互联网往返都会增加建立连接的延迟。你的传输速度受到浏览器和服务器之间最慢的“链条中的一环”的限制。

为了减少你的计算机和服务器之间的距离，你应该考虑缓存你的文件，并在CDN后面托管它们。来自浏览器的请求被路由到CDN边缘位置服务器，该服务器在地理上是请求者的本地位置。如果CDN之前已经缓存了请求，它会立即返回(距离要短得多，所以更快)。如果CDN Edge location尚未缓存文件，它会代表您的最终用户(通过超级快速的专用网络)向您的服务器(称为Origin)发出请求，如果headers允许缓存该文件以备将来的请求。

缓存可能会导致很大的问题，所以我的建议是使用cache busting query string。这提供了CDN和浏览器级缓存的好处-即巨大的速度改进，但仍然允许您轻松更新代码，并确保访问者检索到最新版本。假设您有一个缩小的文件~/minified.js，您可以将其引用为~/minified.js?v=1 (名称/值并不重要)。将来，您可以替换~/minified.js，并将您的标记更新为~/minified.js?v=2。这需要你实际的超文本标记语言不被缓存，或者至少使用短暂的缓存，但这意味着浏览器将把v=1和v=2作为两个独立的请求，所以会下载/缓存它们。

其他一些想法：

• 根据应用程序的不同，将你的javascript分成两个包可能是可行的。一个critical path脚本，它很小，下载速度很快，并且包含允许页面开始呈现的最小脚本。然后是一个更大的、延迟加载的脚本，其中包含稍后在页面加载过程中下载的所有其他内容。虽然这增加了传输文件的总开销，并且基本上回避了这个问题，但它可以让您的页面更快地开始呈现，使它们更快地“显示”。此外，您可以将关键路径代码嵌入到HTML中-向初始有效负载添加几KB，以换取脚本在HTML生成后立即可用。parsed.
• CloudFlare提供了一个免费的CDN包-这是基本的，但可能是合适的(并且包括免费的SSL)。