假设我正在为一个客户构建一个静态的10页网站，整个网站只有几行JavaScript（不到1KB）。在这种情况下，我猜测在每个页面上的脚本标记之间放置<1KB的JavaScript代码内联是最好的（性能），而不是在外部.js文件中。额外的带宽消耗（在页面之间移动时）可能值得删除整个HTTP请求。
另一方面，如果我在同一个网站上有200KB的JavaScript，那么我肯定会把它放在一个单独的文件中，以减少在网站页面之间移动时的带宽。
但我不知道'截止点'应该在哪里。如果我有5KB的JS，我应该把这个内联放在我的HTML中吗？ 10KB怎么样？ 20KB？
显然，'截止点'将取决于具体情况，例如：它可能与移动网站不同。但如果有人有任何一般指示可以帮助指导这个决定，那么我想听听他们。
（ NB ：我对此处的性能仅感兴趣，而不是可维护性等。我可以将代码保存在单独的文件中，但使用某种构建过程或服务器端中间件自动内联，因此可维护性不会成为问题。）
（加分：如果所有注意事项与内联CSS和外部CSS完全相同，请告诉我。）
答案 0 :(得分：3)
我在这里严格谈论表现，更像是一个思想实验（并请原谅缺乏实验性的严谨性）。
如果您正在内联javascript，那么您确实可以节省时间，因为所有内容都在一个http请求中完成。但是，您应该考虑服务器动态生成所需网页所需的时间（SSL也会增加时间）。
最佳案例
如果你可以创建一个生成缩小的javascript并将其注入html页面的构建，结合gzip压缩，你应该导致更低的带宽。您在压缩中坚持的文本越多，与每次请求单独gzipping相比，您的回报就越大。最终，这意味着如果您可以使用所有javascript / css内联静态加载单个html页面，这意味着它肯定会更快。
正常情况（使用动态html和共享js库）
一些stackoverflow帖子的小样本以及它们如何影响我自己的带宽：
304ms 9.67KB
204ms 11.28KB
344ms 17.93KB
290ms 17.19KB
210ms 16.79KB
591ms 37.20KB
229ms 30.55KB
从这一点来看，似乎每个http连接产生的开销（无论文件大小）大约为150毫秒 - 也许在最坏的情况下。现在，问题是，文本（在您的情况下是javascript）必须有多大才能使您的带宽产生150毫秒。根据这篇文章（http://www.telecompetitor.com/akamai-average-us-broadband-connection-speed-is-now-5-3-mbps/），对于宽带用户，我们平均在5.3 mbps（为.6625 MB / s或678.4 KB / s或.6784 KB / ms）。这意味着对于普通的宽带用户，你需要大约100KB下载gzip +缩小的javascript才能使它等于。
请自行调整参数，以了解这对您的受众群体意味着什么。无论你计算什么，这个数字都是你可以更好地内联服务（通过服务器生成的响应）而不是从外部获取/缓存它。
总而言之，我认为出于性能原因，这根本不是瓶颈。压缩+缩小的javascript的大小通常可以忽略不计，并且必须处于无关紧要的数量级上。
答案 1 :(得分：0)
截止点为0KB - “什么时候小到足以值得内联”的答案是“从不”。
除了你说你不想考虑的可维护性问题之外，无论如何它对性能更好。是的，您第一次引用.js文件时有一个额外的HTTP请求，但之后它会被缓存，因此您的整体流量/带宽会随着时间的推移而减少。
CSS文件也是如此。
使用内联JS或CSS使页面更重要比对文件的初始提取的额外请求更昂贵（除非您提供完全静态.html，其中整个页面被缓存很长时间）
答案 2 :(得分：0)
简短回答：这取决于！
假设：
做数字。粗略估计额外HTML会产生多少额外流量，与其余流量成比例，然后决定您是否认为这是可接受的妥协。
如果是1％，则可能不值得担心。但如果它是50％，那么你可以通过将脚本放在一个单独的文件中来减半流量。