通过使用 Javascript 渲染元素来加速页面？答案

【问题标题】：Speed Up Page by Using Javascript to Render Elements?通过使用 Javascript 渲染元素来加速页面？
【发布时间】：2013-04-07 00:30:00
【问题描述】：

只是基于最佳实践告诉我们，为了性能优势，我们更喜欢外部 CSS 和 JS 文件而不是内联 HTML。

提供尽可能小的 HTML 文件是个好主意吗？并使用 Javascript / jQuery 尽可能多地渲染 DOM，在客户端连接 Javascript 事件等？

【问题讨论】：

【解决方案1】：

一般来说，给浏览器提供 HTML 会更快。

当然，一切都取决于服务器创建此 HTML 所需的时间。

但就客户端呈现而言，预构建的 HTML 将始终胜过 javascript 生成的文档。这是因为 DOM-API 相对较慢（尽管最近进行了很多改进）。

CSS 和 JS 的分离更多是与可维护性和 SEO 相关。

【讨论】：

【解决方案2】：

将 CSS 和 JS 保存在不同文件中的原因与性能无关。如果有的话，它可能会因为与服务器的额外往返而减慢您的页面。

真正的原因是，对于任何复杂的网页（应用程序）来说，将页面的逻辑结构（声明性 HTML）与布局 (CSS) 和 UI 逻辑 (Javascript) 分开非常重要。

性能问题可以而且应该使用缓存、缩小等单独解决。

【讨论】：

mfeingold 和 Kenneth，这样的网站怎么样？ developer.yahoo.com/performance/rules.html 这意味着由于更好地使用缓存，外部 CSS 和 JS 更快。这在我认识的工程师中也并不少见。
确实可以缓存CSS和JS，也可以缓存HTML。在下载速度方面，只需尝试将尽可能小的文件发送到客户端。我们在这里谈论两种不同的“速度”：内容的下载速度，然后是客户端的渲染速度
@S.Valmont 这是真的，但不是重点。构建网页时有很多考虑因素，并且方法会根据您网站的动态程度以及您希望它多久更改一次而有所不同。不管你的主要敌人不是速度，而是复杂性。你可以做的任何事情来降低复杂性都会有所帮助。每次您为了性能或其他任何事情而增加复杂性时 - 您都是在自取其辱