问题描述
我最近阅读了一些关于整个客户端与服务器渲染的非常有趣的文章.
因此,当用户访问该页面时,服务器会呈现包含内容的整个页面.所以它加载速度更快,不需要额外的ajax请求来加载数据等.然后,当用户导航到另一个页面时,使用单页应用程序的常用技术.
那么,我为什么要关心?
- 旧浏览器/弱设备/禁用Javascript
- 搜索引擎优化
- 一些页面加载改进
旧浏览器/弱设备/禁用Javascript
例如,IE9 不支持 History API.因此,对于旧浏览器(如果用户也禁用了 javascript),他们只会像过去那样浏览页面.
搜索引擎优化
Google 说它支持 SPA ,但 SPA 不是't 可能出现在谷歌搜索的顶部结果中,是吗?
页面速度
如前所述,第一个页面加载了一个 HTTP 请求,仅此而已.
好的,所以
有很多关于这方面的文章:
- http://nerds.airbnb.com/isomorphic-javascript-未来网络应用程序/
- http://www.sitepoint.com/isomorphic-javascript-applications/
- https://www.lullabot.com/articles/what-is-an-isomorphic-application
但是我应该关心吗?
当然,这取决于你.
是的,这很酷,但是重写/调整现有应用程序需要做很多工作.如果你的后端是 PHP/Ruby/Python/Java/Whatever,我有一个坏消息要告诉你(不一定不可能,但也差不多).
这取决于网站,你可以尝试收集一些统计数据,如果使用旧设备的用户比例很小,那么不值得麻烦,那么为什么不...
让他们受苦
如果您只关心使用旧设备的用户,那么来吧,2015 年,如果他使用 IE8 和 iPod Touch 2 浏览网站,那就是您的用户的问题.例如,Angular 在 1.3 中放弃了对 IE8 的支持大约一年前,那么您为什么不只是提醒用户他们需要升级;)
干杯!
I've been reading some very interesting articles about the whole client vs. server rendering lately.
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/
Now I've been a bit of a fan boy when it comes to client side but after I read these articles some points started to show up in favor of the server side rendering, to my surprise... The main points were:
1) You can upgrade your server, but not your users device - This means, well, yes... you are in control of the server, so if it's under performing you may opt to upgrade/scale. You can't force users to upgrade their devices.
2) First paint vs. last paint - Now on the
experimentally verified...
link above it shows when the users first see the page (first paint) and when the users may use the page 100% (last paint). Now from what I can think of when the user sees the page, it takes their brain some time to process the signals from the visual cortex to the frontal cortex and then to the premoter cortex where the user actually starts clicking his/her finger, that is of course if the html is rendered first so the brain has something to process while loading is happening in the background (js files, binding etc.).
What really got me was the bit were twitter reported people of having up to 10 seconds of loading time for client side rendering, no one should ever experience that! It's kind of saying, "Well if you don't have a good enough device, sorry, you'll just have to wait.".
I've been thinking, isn't there a good way of using both client-side and server-side templating engines and which both client and server use the same template engine and code. In that case it's only to figure out if it's benefactor to supply the client with the rendered page or let the client render it themselves.
In any case, share your thoughts on my sayings and the articles if you want. I'm all ears!
UPD: do it only if you really need it
(4 years and 2 isomorphic enterprise apps later)
If you're required to do SSR, fine. If you can go with a simple SPA - go with it.
Why so? SPAs are easier to develop, easier to debug and cheaper and easier to run.
The development and debugging complications are evident. What do I mean by "cheaper and easier to run", though? Well, guess what, if 10K users try to open your app at the same time your static HTML website (i.e. a built SPA) you won't even feel it. If you're running an isomorphic webapp though, the TTFB will go up, RAM usage will go up and eventually you'll have to run a cluster of those.
So, unless you are required to show some super-low TTFB times (which will likely come through aggressive caching), don't overcomplicate your life.
Original answer from 2015:
Basically you're looking for an isomorphic web app that shares the same code for frontend and backend.
I bet this guy explains that much better that me.
So, when a user comes to the page, the server renders the full page with contents. So it loads faster and requires no extra ajax requests to load data, etc. Then, when a user navigates to another page, the usual techniques for single page applications are used.
So, WHY WOULD I CARE?
- Old browsers / Weak devices / Disabled Javascript
- SEO
- Some page load improvements
Old browsers / Weak devices / Disabled Javascript
For example, IE9 does not support History API. So, for old browsers (and if user disables javascript too), they would just navigate through pages just like they did it it in good old days.
SEO
Google says it supports SPA's but SPA's aren't likely to appear in the top results of google search, are they?
Page speed
As it was stated, the first page loads with one HTTP request, and that's all.
OK, so
There are lots of articles on that:
- http://nerds.airbnb.com/isomorphic-javascript-future-web-apps/
- http://www.sitepoint.com/isomorphic-javascript-applications/
- https://www.lullabot.com/articles/what-is-an-isomorphic-application
But SHOULD I CARE?
It's up to you, of course.
Yeah, that's cool, but it takes much work to rewrite/adapt the existing app. And if your backend is in PHP/Ruby/Python/Java/Whatever, I've got bad news for you (it's not necessarily impossible, but close to that).
It depends on the website, you can try to collect some stats and if the percentage of users with old devices is small, it's not worth the trouble, so why not...
LET THEM SUFFER
If you care only about users with old devices, then c'mon, it 2015, and it's your user's problem if he's using IE8 of browsing websites with a iPod Touch 2. For example, Angular dropped IE8 support in 1.3 approximately a year ago, so why wouldn't you just alert the users that they need to upgrade ;)
Cheers!
这篇关于客户端与服务器端模板(哪个?)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!