为什么80%的码农都做不了架构师?>>>   

按照以往的开发模式,前端人员制作好静态页面交给与后端人员进行动态嵌套开发。迭代模式带来一系列问题,静态页面套成动态后,一些操作、业务、模版技术等动态页面已经跟静态页面有了一些差距。这时候前端人员改了一个BUG,或者叠加了一个功能,后端人员就必须向前端人员了解更改的范围,再叠加,由于都是人为过程,带来很多困扰,开发效率也很低。

当前后端页面以及逻辑没有合并之前,测试人员面临等待的问题,能否让测试与开发并行也是我们需要考虑的一个问题。

这时候我们想到了,能否以暴露服务的方式把java的接口暴露出来交给前端人员进行使用,后端人员关注数据接口,前端人员负责页面逻辑,调用数据使用模拟的方式。当然,这其中我们需要前后端俩者之间的数据约定。而测试在理想状态下只需要测试好接口和前端的页面即可。

在之前的业务系统中,大部分用flex进行开发。有了flex的经验,很容易让我们想到,它就是一个前后端分离的很好的实践。但是由于它过于笨重,加载速度无法满足,产品开始转型到html。这时候,我们想到了前后端分离的例子就是SPA(Single-page application),所有用到的展现数据都是后端通过异步接口(ajax/json)的方式提供的,前端只管展现。

在上述的问题中,自己开发的分布式异步调用框架eos诞生了,在它的驱使下,我们的系统到处都是ajax或jsonp。后端人员很轻松的将Service暴露为web rest接口,前端人员通过ajax进行调用渲染。紧接着我们踏进了angular的殿堂中,在eos的支持下,调用接口服务非常轻松。

但是先不说angular的笨重侵入性,可能我们需先考虑的是SPA这种方式的可行适用性:

(1)这种方式是浏览器端渲染的方式:需等待模版在浏览器端载入完成后才开始渲染,首次进入会有白屏等待渲染的时间,不利于用户体验;重要内容都在前端组装,不利于SEO。

(2)浏览器允许的并发请求资源数的限制。基于端口数量和线程切换开销的考虑,浏览器不可能无限量的并发请求。目前主流浏览器也是限制在一定数量内,当超过此连接数的时候,就会形成请求阻塞。这种在请求响应比较慢的情况下,就会更加明显。

(3)想象一下这个场景多么美好:前端来决定某个模板是服务端渲染还是客户端渲染,当首屏的时候,服务端直接生成html,不是首屏的时候,就ajax在浏览器端渲染展示。但是SPA做不到,它需要后端会帮忙处理一些展现逻辑,这就意味着后端还是涉足了View层的工作,不是真正的前后端分离。所以,很多场景下还有同步/同步+异步混合的模式,SPA不能作为一种通用的解决方案。

还能不能愉快地码代码呢?我们只是想专注做自己的事情!

前端组组长一直在摸索公司前端如何做下去,有一天,他带着百度的FIS(不懂的fis自己问度娘吧)来找我,要我支持下后端部分。fis看起来挺不错的一套前端解决方案,是一系列的工具。基于它有几种解决方案,他选择了jello,此方案事实上就是让前端写java端的模版代码。稍微测试一番,jello确实是与fis配合起来了,也把模版和部分页面逻辑交给了前端自行处理。但是还是存在问题,java人员需要编写控制器代码,而前端人员的业务逻辑跳转一定依赖于java人员给编写的控制器。前后端还是存在着交集。

这时候,我想,如果直接把java人员写的控制器交给前端人员写呢?想起了之前看过的淘宝”中途岛“项目的文章(前后端分离的思考与实践)。前端负责View层与Controller层,后端负责Model层,业务处理/数据。其实,也就是类似把java spring mvc的vc交给前端人员,但是不可能让前端人员去学习java,再看nodejs如火如荼的发展,想想要是把node作为后端,让前端来写也是说得过去的。果断上fis看了下几个解决方案,发现其中有一个基于nodejs开发的框架yog,最后决定试水。

这也是一次大胆的试水,因为都没有接触过nodejs,我们用它需要知道几个问题:

(1)node是否足够稳定?学习成本呢?

从目前来看,node热度充足,已经有很多案例。学习上,前端人员还是一样学习js,多了解node的一些机制以及web后端的session,cache,分布式等控制,门槛不算高。

(2)如何调用java服务接口

目前,基于自己开发的eos,实现node-eos进行服务调用,调用也是方便不复杂。

(3)一些原有的java组件,如何对接

如果node已经有对应的工程模块,那直接使用,如果没有则需要自己适配。大部分可以通过eos的java服务调用方式,java开放出服务接口给予使用。

最终,借用几张效果图来表达整个结构:

其实,并没有绝对的事情,个人认为,此方式也要根据公司资源配置进行选择。当分离出来后,前端人员门槛变高了,比例人员也要多,前端压力大了。如果一直要较真再分下去,或许有以后的话,前端工程师本身又自然会分化成纯前端和nodejs工程师,那又是变成前端的前后端了。总之,还有很多事情需要解决,我们只是试探学习罢了~

转载于:https://my.oschina.net/ulyn/blog/324196

前后端分离实践(试探篇)相关推荐

  1. 若依前后端分离如何写移动端接口_前后端分离实践的架构设计

    前后端分离的项目开发策略已经不是什么新鲜东西了,网上介绍这方面的文章非常多.我自己是在14年的时候接触到的,对这种开发策略一直爱不释手,不管新老项目都会首先用前后端分离的思维先去思考一番.从14年到现 ...

  2. rsa前后端加密流程_不懂前后端分离?这篇就够了

    一 传统的开发模式 前后端分离前我们的开发协作模式一般是这样的: 前端写好静态的HTML页面交付给后端开发.静态页面可以本地开发,也无需考虑业务逻辑只需要实现View即可. 后端使用模板引擎去套模板, ...

  3. 老树发新芽-前后端分离实践

    最早从Web2.0 Ajax技术开始兴起,就有提前后端分离了.从Gmail的单页应用,到现在的单页应用层出不穷.浏览器渲染引擎也一直在突破,越来越多的交互.计算放在了浏览器这一层.传统后端MVC架构, ...

  4. 谈谈前后端分离实践中如何提升RESTful API开发效率

    点击上方"朱小厮的博客",选择"设为星标" 后台回复"书",获取推荐书籍 来源:33h.co/edZR 团队内部RestAPI开发采用设计驱 ...

  5. api权限管理系统与前后端分离实践

    https://segmentfault.com/a/1190000014368885 转载于:https://www.cnblogs.com/java-le/p/9759679.html

  6. 淘宝前后端分离实践(PPT)

    链接:http://2014.jsconf.cn/slides/herman-taobaoweb/index.html#/

  7. 移动端开发者眼中的前端开发流程变迁与前后端分离

    写在最开始 这是一篇面向移动端开发者的科普性文章,从前端开发的最初流程开始,结合示范代码,讨论开发流程的演变过程,希望能覆盖一部分前端开发技术栈,从而对前端开发的相关概念形成初步的认识. 本文会提供一 ...

  8. 基于shiro+jwt的真正rest url权限管理,前后端分离

    代码地址如下: http://www.demodashi.com/demo/13277.html bootshiro & usthe bootshiro是基于springboot+shiro+ ...

  9. 前后端分离架构下CSRF防御机制

    背景 1.什么是CSRF攻击? 这里不再介绍CSRF,已经了解CSRF原理的同学可以直接跳到:"3.前后端分离下有何不同?". 不太了解的同学可以看这两篇对CSRF介绍比较详细的参 ...

最新文章

  1. 【宽搜】XMU 1039 Treausure
  2. python 基础命令-python常用命令有哪些
  3. 【Windows 逆向】OD 调试器工具 ( CE 工具通过查找访问的方式找到子弹数据基地址 | 使用 OD 工具附加游戏进程 | 在 OD 工具中查看子弹数据地址 | 推荐 )
  4. 【RAY TRACING THE REST OF YOUR LIFE 超详解】 光线追踪 3-5 random direction ONB
  5. java字符串的课后作业
  6. Class.forName()和ClassLoader.getSystemClassLoader().loadClass()区别
  7. Java12题:发奖金问题
  8. C++ const 引用 指针答疑
  9. mysql主从不同步不报错_MySQL主从不同步解决
  10. 21位美国名校学生领袖在湖北了解中国媒体情况
  11. 2018.01.25-现货黄金复盘
  12. 10个 NPM 使用技巧
  13. JavaScript学习(五十七)— arguments对象
  14. 在线解压rar_解压指南!新手必看
  15. 自定义Android TabHost的背景及文字
  16. 微服务架构实战:Swagger规范RESTful API
  17. OpenCV_(Based on Sobel Filter to Detect edges) 基于Sobel算子的方向滤波器检查边缘
  18. 2021年计算机二级web题库,2021年全国计算机等级考试(二级Web程序设计)经典试题及答案...
  19. 盘点那些大学生自习室最无法忍受的行为!
  20. Ps钢笔工具抠图、更换背景及边缘优化步骤

热门文章

  1. domino大百科常见问题总汇1(转载)
  2. hadoop优化之操作系统优化
  3. 【重读iOS】网络请求2:应用
  4. MySQL MHA 高可用架构
  5. vagrant box php开发环境配置 -- 重新打包发布vagrant box
  6. Android自定义View:MeasureSpec的真正意义与View大小控制
  7. ORACLE百万记录SQL语句优化技巧
  8. SQL语句 - 嵌套查询
  9. InnoDB Double write
  10. JAVA学习笔记--4.多线程编程 part1.背景知识和内存模型