前端开发模式发展

web1.0时代

前端开发模式发展_第1张图片
web1.0

特点:部分前后端,3-5人搞定所有开发,页面在服务器端生成,服务器端生成什么,浏览器端就展示什么,展现在web server层展现。

业务越来越复杂,
service越来越多 --> 调用逻辑越来越复杂 --> 前端搭建本地环境困难
开发人员越来越多,
前端开发难以本地化,
开发效率越来越低
JSP页面前端后台职责划分越来越不明确,可维护性越来越低

前端开发模式发展_第2张图片
web1.0 组件化

后端MVC时代

降低复杂度,以后端为出发点,后端架构升级,出现了 Structs、Spring MVC

前端开发模式发展_第3张图片
后端MVC

为了使前后端职责区分,view层干净,出现了velocity, freemarker等模板技术,使模板文件写不了java代码

依然存在的问题:
前端开发重度依赖后端的开发环境,前后端怎么协作?
1. 前端本地开发demo,后端拿着demo转换成模板文件,仍需前端进行确认,沟通成本加剧。
2. 前端负责浏览器端的所有开发和服务器端的模板文件开发,前端的技术要求比较高,前端重度依赖后端的开发环境,开发环境严重影响开发效率。

前后端职责依旧区分不明确
模板层掺杂业务代码,controller层掺杂页面路由功能,controller和model职责区分不明确。

ajax带来的单页面应用SPA时代

前端开发模式发展_第4张图片
SPA

前后端分工非常明确,数据交互都是ajax,后端只负责提供数据接口给前端调用,前端工作变得复杂,前端出现MVC


前端开发模式发展_第5张图片
前端MVC

前后端接口怎么约定?

  • 前后端需要有严格的接口约定规范,实现前后端高效并行开发。需要确定一种适合的api管理规范

前端开发的复杂度怎么控制?

  • 解决方案:选择一个适合自己的MVC前端框架

前端为主的MV*时代

前端开发模式发展_第6张图片
MV*

优点:

  • 前后端职责清晰。前端写浏览器端,后端写服务器端。为了让前端开发本地化,测试数据怎么模拟?后端处理业务逻辑,输出RESTful接口?
  • 前端工作可控,复杂度可控,分层合理

不足:

  • 代码不能复用
  • 全异步,SEO不利
  • 性能并非最佳,特别是移动互联网环境下
  • SPA 不能满足所有需求,依旧存在大量多页面应用。URL Design 需要后端配合,前端无法完全掌控

Node 带来的全栈时代

你可能感兴趣的:(前端开发模式发展)