客户端与服务器端模板(哪一个?)

时间:2015-03-26 03:02:11

标签: javascript html server-side template-engine client-side-templating

我最近一直在阅读一些关于整个客户端与服务器渲染的非常有趣的文章。

http://www.onebigfluke.com/2015/01/experimentally-verified-why-client-side.html

http://www.quirksmode.org/blog/archives/2015/01/angular_and_tem.html

http://tomdale.net/2015/02/youre-missing-the-point-of-server-side-rendered-javascript-apps/

现在我对客户端有点狂热,但在我阅读这些文章之后,有些观点开始出现在服务器端渲染上,令我惊讶的是......主要观点是:

  • 1)您可以升级您的服务器,但不能升级您的用户设备 - 这意味着,是的,是...... 可以控制服务器,如果它正在执行,您可以选择升级/扩展。您无法强制用户升级其设备。

  • 2)第一次上漆与上一次上漆 - 现在在上面的experimentally verified...链接上显示用户第一次看到页面(第一次上漆)以及用户何时可能使用页面100%(上次绘画)。现在从用户看到页面时我能想到的是,它需要大脑一些时间来处理从视觉皮层到额叶皮层的信号,然后到达用户真正开始点击他/她的手指的前置皮层,当然,如果首先渲染html,那么在后台进行加载时(js文件,绑定等),大脑会处理一些事情。

真正让我感到有点的是Twitter报道人们有多达10秒的加载时间用于客户端渲染,没有人应该体验!有点儿说,“如果你没有足够好的设备,对不起,你只需要等待。”。

我一直在想,使用两个客户端和服务器端模板引擎是不是一个好方法,客户端和服务器都使用相同的模板引擎和代码。在这种情况下,它只是要弄清楚它是否是为客户提供渲染页面或让客户自己渲染它的好处。

无论如何,如果你愿意,可以分享你对我的说法和文章的看法。我都是耳朵!

2 个答案:

答案 0 :(得分:17)

基本上你会看到isomorphic web app与前端和后端共享相同的代码。

  

同构JavaScript

     

运行客户端和服务器端的JavaScript应用程序。同构JavaScript框架是JavaScript框架发展的下一步。这些新的库和框架正在解决与传统JavaScript框架相关的问题。

我敢打赌this guy explains that much better我。

enter image description here

因此,当用户访问该页面时,服务器会呈现包含内容的整页。因此它加载速度更快,并且不需要额外的ajax请求来加载数据等。然后,当用户导航到另一个页面时,会使用单页应用程序的常用技术。

那么,我为什么要关心?

  • 旧浏览器/弱设备/已禁用Javascript
  • SEO
  • 一些页面加载改进

旧浏览器/弱设备/禁用Javascript

例如,IE9不支持History API。因此,对于旧浏览器(如果用户也禁用了javascript),他们只会像过去那样在页面中导航。

SEO

谷歌说it supports SPA's但是SPA不太可能出现在谷歌搜索的最佳结果中,是吗?

页面速度

如上所述,第一页加载了一个HTTP请求,而这就是全部。

好的,所以

有很多文章:

但是我应该关心吗?

当然,这取决于你。

是的,这很酷,但重写/改编现有应用程序需要做很多工作。如果你的后端是PHP / Ruby / Python / Java / Whatever,那我就有坏消息(这不一定是不可能的,但接近于此)。

这取决于网站,您可以尝试收集一些统计数据,如果使用旧设备的用户比例很小,那就不值得麻烦了,为什么不呢......

让他们吵架

如果您只关心使用旧设备的用户,那么请点击2015年,如果他使用IE8浏览带有iPod Touch 2的网站,那么这是您的用户问题。例如,Angular在1.3中大约放弃了IE8支持一年前,为什么你不提醒用户他们需要升级;)

干杯!

答案 1 :(得分:-2)

关于此主题的所有对话都遗漏了一点。字节发送给客户端。在服务器上呈现为HTML的页面要小得多。传输的字节越少,对于每个人(服务器和客户端)都越好。我已经看到云站点的带宽成本,甚至减少10%也可以节省大量成本。客户端JS页面总是很胖。