前言

最近碰了个壁,公司开发的一个新项目里我大胆地提出要前后端完全分离,用JavaScript模板引擎、ajax、路由等技术替代繁琐的前后端混合的业务逻辑,项目进行到一半前辈提出来仅仅靠前端的力量无法满足公司对SEO的要求。是放弃之前的工作重新改用后端velocity模板引擎来渲染页面,把工作重心转交给Java后端,还是坚持走全后端分离路线但是另辟一条蹊径呢? 最后又来了个大胆的决定——用nodeJS搭一个中间层来渲染数据,弥补前端模板引擎和路由无法做到的SEO友好性工作。年轻就是任选,哈哈 _

前后端分离(参考淘宝)

什么是前后端分离

大家一致认同的前后端分离的例子就是SPA(Single-page application),所有用到的展现数据都是后端通过异步接口(AJAX/JSONP)的方式提供的,前端只管展现。
从某种意义上来说,SPA确实做到了前后端分离,但这种方式存在两个问题:

WEB服务中,SPA类占的比例很少。很多场景下还有同步/同步+异步混合的模式,SPA不能作为一种通用的解决方案。

现阶段的SPA开发模式,接口通常是按照展现逻辑来提供的,有时候为了提高效率,后端会帮我们处理一些展现逻辑,这就意味着后端还是涉足了View层的工作,不是真正的前后端分离。

SPA式的前后端分离,是从物理层做区分(认为只要是客户端的就是前端,服务器端的就是后端),这种分法已经无法满足我们前后端分离的需求,我们认为从职责上划分才能满足目前我们的使用场景:

前端:负责View和Controller层。
后端:只负责Model层,业务处理/数据等。

为什么要前后端分离

现有开发模式的适用场景

不同的开发模式各有各的适用场景,没有哪一种完全取代另外一种。

比如后端为主的MVC,做一些同步展现的业务效率很高,但是遇到同步异步结合的页面,与后端开发沟通起来就会比较麻烦。
Ajax为主SPA型开发模式,比较适合开发APP类型的场景,但是只适合做APP,因为SEO等问题不好解决,对于很多类型的系统,这种开发方式也过重。

前后端职责不清

在业务逻辑复杂的系统里,我们最怕维护前后端混杂在一起的代码,因为没有约束,M-V-C每一层都可能出现别的层的代码,日积月累,完全没有维护性可言。
虽然前后端分离没办法完全解决这种问题,但是可以大大缓解。因为从物理层次上保证了你不可能这么做。

开发效率问题

电商网站Web基本上都是基于MVC框架webx,架构决定了前端只能依赖后端。
所以我们的开发模式依然是,前端写好静态demo,后端翻译成VM模版,这种模式的问题就不说了,被吐槽了很久。

直接基于后端环境开发也很痛苦,配置安装使用都很麻烦。为了解决这个问题,我们发明了各种工具,比如VMarket,但是前端还是要写VM,而且依赖后端数据,效率依然不高。

另外,后端也没法摆脱对展现的强关注,从而专心于业务逻辑层的开发。

对前端发挥的局限
性能优化如果只在前端做空间非常有限,于是我们经常需要后端合作才能碰撞出火花,但由于后端框架限制,我们很难使用Comet、Bigpipe等技术方案来优化性能。

为了解决以上提到的一些问题,我们进行了很多尝试,开发了各种工具,但始终没有太多起色,主要是因为我们只能在后端给我们划分的那一小块空间去发挥。只有真正做到前后端分离,我们才能彻底解决以上问题。

怎么做前后端分离

前端:负责View和Controller层。
后端:负责Model层,业务处理/数据等。

试想一下,如果前端掌握了Controller,我们可以做url design,我们可以根据场景决定在服务端同步渲染,还是根据view层数据输出json数据,我们还可以根据表现层需求很容易的做Bigpipe,Comet,Socket等等,完全是需求决定使用方式。

基于NodeJS“全栈”式开发

如果想实现上图的分层,就必然需要一种web服务帮我们实现以前后端做的事情,于是就有了标题提到的“基于NodeJS的全栈式开发”

这张图看起来简单而且很好理解,但没尝试过,会有很多疑问。

SPA模式中,后端已供了所需的数据接口,view前端已经可以控制,为什么要多加NodeJS这一层?
多加一层,性能怎么样?
多加一层,前端的工作量是不是增加了?
多加一层就多一层风险,怎么破?
NodeJS什么都能做,为什么还要JAVA?
这些问题要说清楚不容易,下面说下我的认识过程。

为什么要增加一层NodeJS?

现阶段我们主要以后端MVC的模式进行开发,这种模式严重阻碍了前端开发效率,也让后端不能专注于业务开发。

解决方案是让前端能控制Controller层,但是如果在现有技术体系下很难做到,因为不可能让所有前端都学java,安装后端的开发环境,写VM。

NodeJS就能很好的解决这个问题,我们无需学习一门新的语言,就能做到以前开发帮我们做的事情,一切都显得那么自然。

性能问题

分层就涉及每层之间的通讯,肯定会有一定的性能损耗。但是合理的分层能让职责清晰、也方便协作,会大大提高开发效率。分层带来的损失,一定能在其他方面的收益弥补回来。另外,一旦决定分层,我们可以通过优化通讯方式、通讯协议,尽可能把损耗降到最低。

举个例子:

淘宝宝贝详情页静态化之后,还是有不少需要实时获取的信息,比如物流、促销等等,因为这些信息在不同业务系统中,所以需要前端发送5,6个异步请求来回填这些内容。
有了NodeJS之后,前端可以在NodeJS中去代理这5个异步请求,还能很容易的做Bigpipe,这块的优化能让整个渲染效率提升很多。
可能在PC上你觉得发5,6个异步请求也没什么,但是在无线端,在客户手机上建立一个HTTP请求开销很大,有了这个优化,性能一下提升好几倍。

前端的工作量是否增加了?
相对于只切页面/做demo,肯定是增加了一点,但是当前模式下有联调、沟通环节,这个过程非常花时间,也容易出bug,还很难维护。

所以,虽然工作量会增加一点,但是总体开发效率会提升很多。

另外,测试成本可以节省很多。以前开发的接口都是针对表现层的,很难写测试用例。如果做了前后端分离,甚至测试都可以分开,一拨人专门测试接口,一拨人专注测试UI(这部分工作甚至可以用工具代替)。

增加Node层带来的风险怎么控制?
随着Node大规模使用,系统/运维/安全部门的同学也一定会加入到基础建设中,他们会帮助我们去完善各个环节可能出现的问题,保障系的稳定性。

Node什么都能做,为什么还要JAVA?
我们的初衷是做前后端分离,如果考虑这个问题就有点违背我们的初衷了。即使用Node替代Java,我们也没办法保证不出现今天遇到的种种问题,比如职责不清。我们的目的是分层开发,专业的人,专注做专业的事。基于JAVA的基础架构已经非常强大而且稳定,而且更适合做现在架构的事情。

淘宝基于Node的前后端分离

最上端是服务端,就是我们常说的后端。后端对于我们来说,就是一个接口的集合,服务端提供各种各样的接口供我们使用。因为有Node层,也不用局限是什么形式的服务。对于后端开发来说,他们只用关心业务代码的接口实现。

服务端下面是Node应用。

Node应用中有一层Model Proxy与服务端进行通讯。这一层主要目前是抹平我们对不同接口的调用方式,封装一些view层需要的Model。

Node层还能轻松实现原来vmcommon,tms(引用淘宝内容管理系统)等需求。

Node层要使用什么框架由开发者自己决定。不过推荐使用express+xTemplate的组合,xTemplate能做到前后端公用。

怎么用Node大家自己决定,但是令人兴奋的是,我们终于可以使用Node轻松实现我们想要的输出方式:JSON/JSONP/RESTful/HTML/BigPipe/Comet/Socket/同步、异步,想怎么整就怎么整,完全根据你的场景决定。

浏览器层在我们这个架构中没有变化,也不希望因为引入Node改变你以前在浏览器中开发的认知。

引入Node,只是把本该就前端控制的部分交由前端掌控。

我们还需要要做什么?
把Node的开发流程集成到淘宝现有的SCM流程中。
基础设施建设,比如session,logger等通用模块。
最佳开发实践
线上成功案例
大家对Node前后端分离概念的认识
安全
性能
技术上不会有太多需要去创新和研究的,已经有非常多现成的积累。其实关键是一些流程的打通和通用解决方案的积累,相信随着更多的项目实践,这块慢慢会变成一个稳定的流程。

总结
基于node的全栈式开发模式淘宝是个很好的例子,技术开源,我们大可以充分借鉴它们成功的经验。好了,文字介绍大家看的可能不是很爽,最后留一个在线的幻灯片,也是来自淘宝的,感兴趣的可以看一看。

@ 幻灯片 《淘宝前后端分离实践》
————————————————
版权声明:本文为CSDN博主「Jafeney」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/u011413061/article/details/50294263

【探索】NodeJS中间层搭建——楔子相关推荐

  1. NodeJs本地搭建服务器,模拟接口请求,获取json数据

    最近在学习Node.js,虽然就感觉学了点皮毛,感觉这个语言还不错,并且也会一步步慢慢的学着的,这里实现下NodeJs本地搭建服务器,模拟接口请求,获取json数据. 具体的使用我就不写了,这个博客写 ...

  2. vue路由无痕浏览nodeJS环境搭建

    目录 一.vue路由&无痕浏览 1. SPA是什么 2. SPA实现思路和技术点 ①技术点 ②思路 3. 通过vue的路由可实现多视图的单页Web应用(基于html的SPA) 4. route ...

  3. Vue路由--无痕浏览 NodeJs环境搭建

                                                               文章目录 一.路由 二.SPA是什么 三.路由实现步骤 导入Vue.vue-rou ...

  4. vue路由无痕浏览nodeJS环境搭建ElementUI简介

    目录 一.vue路由&无痕浏览 1. SPA是什么 2. SPA实现思路和技术点 ①技术点 ②思路 3. 通过vue的路由可实现多视图的单页Web应用(基于html的SPA) 4. route ...

  5. vue路由、无痕浏览和nodeJS环境搭建、ElementUI简介

    目录 1.vue路由和无痕浏览 1.1.SPA是什么 1.2.SPA实现思路和技术特点 1.2.1.技术特点 1.2.2.思路 1.3.通过vue的路由可实现多视图的单页Web应用 1.4.route ...

  6. Vue05之ElementUI入门+nodejs环境搭建+运行nodejs项目

    14天阅读挑战赛 努力是为了不平庸~ 目录 1. ElementUI入门 1.1 ElementUI简介 1.2 Vue+ElementUI安装 1.3 开发示例 2. 搭建nodejs环境 2.1 ...

  7. 爱奇艺PC Web NodeJS中间层实践

    爱奇艺作为中国最大的互联网视频综合门户,一直致力于给用户提供更好的使用体验及观影品质.PC主站作为爱奇艺的门户,日均覆盖用户达千万级别.随着公司业务的扩展及端上对项目更新迭代的频率越来越快,对接口的性 ...

  8. nodejs网站搭建学习

    nodejs网站搭建学习 1.1下载并安装node.js 下载地址:https://nodejs.org/en/download/ 下载windows安装包,如node-v12.13.1-x64.ms ...

  9. Vue路由无痕浏览 - nodeJs环境搭建

    目录 一.Vue路由 1.1 路由的使用步骤 1.2 无痕浏览 二.nodeJs环境搭建 2.1 Node.js是什么 2.2 配置NodeJS环境 2.3 下载github的Vue项目 一.Vue路 ...

最新文章

  1. 被骗两次?黄仁勋骗过世界的14秒,英伟达押宝未来的元宇宙……
  2. 使用swipemenulistview实现列表的左右滑动
  3. SAP 电商云 Spartacus 产品明细页面的 OCC API 是如何被触发的
  4. 远程桌面不能连接,提示awgina.dll取代错误的解决办法
  5. 谈谈怎样提高炼丹手速
  6. BlueHost Gzip优化JS和CSS传输
  7. sysbench0.5 mysql_sysbench 0.5安装步骤
  8. ios uiwindow弹窗_iOS-UIWindow详解
  9. 不要相信程序员在加班时间写的代码
  10. Windows 下安装 SVN 服务器、创建版本库、授权访问
  11. Android新浪微博分享
  12. 夜神模拟器7.12 安装 xposed
  13. 高通CSRA6640单芯片DDFA放大器解决方案
  14. 什么是Java股票交易接口?
  15. 将实时频谱分析仪与HIF输出配合使用
  16. Postgresql多行合并一行
  17. 李彦宏:我不是传奇(网络转载)
  18. 批量启动docer容器shell脚本
  19. 鳄鱼法则(特转此贴,给不会止损的朋友们)
  20. 张宇闭关修炼【超清pdf】

热门文章

  1. Python Xml dom解析 输出json操作
  2. 【MySQL】19-MySQL中如何创建数据库和管理数据库
  3. win10 安装U8服务器版本IE Web Control 插件提示错误
  4. 2013年火车票之抢票神器--【车票无忧】
  5. 关闭windows系统ssh连接linux终端发出提示音
  6. 2021年高考志愿填报计算机类专业历年分数报考分析
  7. 华硕fx80ge安装linux,华硕FX80GE火陨版(i7 8750H)笔记本u盘重装系统win8教程
  8. 一个用Dijkstra算法实现的路由算法的java程序——9 图信息文件示例
  9. golang---实现wake on lan
  10. 设计师一定要知道这几个网站,解决你80%的设计素材。