13

我在一个大型网站上工作，我们正在将很多功能转移到客户端（Require.js、Backbone 和 Handlebars 堆栈）。甚至还有关于可能将所有渲染转移到客户端的讨论。

但是阅读一些文章，尤其是关于 Twitter 远离客户端渲染的文章，其中提到服务器端更快/更可靠，我开始有疑问。我不明白在 JS 中从 JSON 和模板渲染相当简单的 HTML 小部件是如何在具有 4-8 GB RAM 的双核 CPU 上的现代浏览器比在服务器端应用程序中包含数十个组件要慢。有没有关于这方面的实际生活基准数据？

此外，似乎通过服务器端模板引擎解析 HTML 模板不能比从 Handlebars 模板渲染相同的 HTML 代码更快，尤其是如果这是一个 precomp JS 函数？

4

3 回答 3

9

原因有很多：

  1. JavaScript 是解释性语言，比服务器端慢（通常用编译语言完成）
  2. DOM 操作很慢，如果你在 JS 中操作它会导致性能不佳。有一些方法可以克服这个问题，比如在文本中准备渲染然后对其进行评估，这实际上可能会让你尽可能接近服务器端渲染。
  3. 有些浏览器太慢了，尤其是旧的 IE
于 2012-10-28T04:30:49.330 回答
4
  • 编译语言与解释 javascript 的性能
  • 缓存，即提供另一个用户已经请求的完全相同的页面，这消除了每个客户端呈现它的需要。非常适合具有巨大流量的网站 - 即新闻网站。微缓存甚至可以提供近乎实时的更新，同时提供来自缓存的大量流量。无需等待客户端渲染
  • 减少对使用旧电脑或浏览器速度慢/残废的用户的依赖
  • 只需要担心渲染，更少依赖不同浏览器如何管理DOM（可靠性）

但是对于复杂的 UI，交互的客户端渲染将提供更快速的用户体验。

这实际上取决于您要优化的性能以及有多少用户。

于 2012-10-28T04:53:42.167 回答
1

要在客户端运行代码，首先必须加载它。服务器端代码仅在服务器启动时加载，而客户端代码必须在每次页面时加载。在任何情况下，加载页面时都必须解释代码，即使文件已经被缓存。您可能还会在浏览器中缓存 JS 解析树，但我认为这些不会持久化，因此它们不会存在很长时间。

这意味着无论 JavaScript 有多快（而且非常快），都必须在用户等待时执行工作。许多研究表明，页面加载时间极大地影响了用户对网站质量和相关性的看法。

底线是您最多有 500 毫秒的时间从典型开发人员环境中的干净缓存中呈现您的页面。较慢的设备和网络将使大多数用户几乎无法接受这种延迟。

因此，在页面加载期间，您可能有 50-100 毫秒的时间在 JavaScript 中执行操作，所有这些，总计，这意味着渲染一个复杂的页面，嗯，不容易。

于 2017-04-06T12:28:32.463 回答