繁体 English 中英

在 html 中包含 javascript 而不是链接到外部文件有什么缺点吗？

[英]Is there a downside to including javascript in html instead of linking to an external file?

原文 2020-09-05 17:05:28 7 2 javascript/ html/ sockets

我正在考虑加快我正在开发的网站的速度。 我知道套接字连接很昂贵，所以我在想......在实际的 html/php 源代码中包含 css 和 javascript 代码而不是链接到它有什么缺点吗？

似乎我可以简单地将所有代码放在 html 源代码中而不是对各种文件进行 10 次调用，而不是对外部文件进行任何套接字调用？

我知道我可以将所有内容放入 1 个 javascript 文件并调用它，但这仍然会创建一个套接字调用。

我意识到这可能不会有太大的不同，可能只是一个思考练习，但是仅仅内联代码有什么真正的缺点吗？

2 个解决方案

不同的资源（即 HTML、CSS、JS、图像……）不一定需要新的套接字连接。 在 HTTP/1.1 中，同一个连接通常用于多个资源（但只能在彼此之后），而在 HTTP/2 中，多个资源可以通过同一个 TCP 连接并行加载。 因此，与其尝试通过将 HTML、JS、CSS 组合到单个文件中来优化交付，不如使用 HTTP/2 来优化传输。

除此之外，脚本、CSS 和图像等资源通常在 HTML 页面之间共享。 在这种情况下，一次又一次地提供相同的脚本等只会是浪费。 相反，适当的缓存可以重用页面之间的共享资源。

最后，内联脚本被认为是一个安全问题 - 只需查找Cross Site Scripting 。 将脚本与内容分开允许使用严格的内容安全策略来防止此类攻击。

这取决于不同的情况。 例如（您的 js 文件的大小）。

如果你的 js 文件很大并且有很多代码，那么你应该考虑链接，因为有很多优点 -
(i) 它可以由浏览器本地缓存，以便用户下次访问时，您的网站加载速度更快。
如果您的 js 文件非常小，请考虑将其嵌入到 HTML 中，因为它也有很多优势 -
(i) 您的服务器上的请求会减少。
(ii) 如果你想动态分配一些变量，你应该在 HTML 中嵌入 js，因为它不能用链接的 js 文件完成。