多年前,Web是一群由HTML和CSS构建的静态页面,没有太多的交互性。每个用户行为要求服务器来创建和提供一个完整的页面。幸于JavaScript的出现,开发者开始创建漂亮的效果。不过这是随着Ajax的出现才开始的一场革命。Web开发者开始编写能够与服务器发送和接收数据的代码,同时不需要重新加载页面。
随着时间的推移,客户端的“职责”增长了很多,导致了一种新的应用类型,即SPA(单一页面应用)。在一个SPA中,所有必要的资产都通过单一页面加载或动态加载恢复,并在必要时添加到页面中。这样的例子有Gmail和StackEdit编辑器。
SPA允许更好的互动,因为几乎所有的操作都在客服端中执行,最大限度的保持与服务器通信。不幸的事它也存在一些重大问题,接下来我们讨论其中的一些。
性能
因为SPA需要比静态页面更多的客服端代码,增加了下载的数据量。这会导致较慢的初始加载时间,从而产生不好的后果,比如用户的流失和收入的减少。引用微软的一篇文章中的一句话:
一份Bing的研究发现一个页面加载时间增加10ms就是花费站点250美元。
SEO
由于SPA依赖于JavaScript执行,服务器不产生所有的HTML内容。因此网络爬虫在索引页面时会有很多困难(网络爬虫是一种按照一定的规则,自动的抓取万维网信息的程序或者脚本。另外一些不常使用的名字还有蚂蚁、自动索引、模拟程序或者蠕虫)。最近谷歌改进其网络爬虫,让它接纳基于JavaScript的页面。然而对于Bing、Yahoo以及其他的搜索引擎呢?对所有业务而言良好的索引是至关重要的,因为它通常会带来更多的访问和更高的收入。
同构JavaScript应用
同构JavaScript应用指的是用JavaScript编写的应用,能够同时运行于客户端和服务器。因此,你只需编写一次代码,在服务器上执行它来实施静态页面,同时执行于客户端以允许快速的交互。所以这种方法在两个世界中都能取得最好的结果,避免了前面描述的两个问题。
如今有几种框架可以帮助你开发这类应用,而其中最著名的框架之一可能就是Meteor。Meteor是一个开源的JavaScript框架,基础构架是Node.JS + MongoDB,专注于实时的Web应用。另一个想提到的项目是Render,一个通过Airbnb的小型库,允许你同时在客户端和服务器上运行Backbone.js应用。
越来越多的企业开始对项目采用Node.js,在客户端和服务器之间共享代码变成一种更普遍自然的选择。这一趋势通过库(如React)共享模版得到增强。