是我参与11月更文挑战的第9天,活动详情查看:2021最后一次更文挑战
定义问题、解决问题
没有框架
最初的前端是没有框架的,因为简单的页面和代码并没有架构可言,通过操作DOM就能完成的工作不需要复杂的设计模式和代码管理机制,就不需要框架来支撑起整个应用
那个刀耕火种的年代前端HTML大多数是由后端渲染的,如Java中的jsp,那个时代流行用table布局,以CSS进行简单的辅助
AJAX异步框架
后来的前端开始编写一些简单的JavaScript脚本来做动画效果,做一些轮播图用来放置广告
直到2005年,谷歌在诸多他的web应用中使用到了一个叫异步通信的技术,如谷歌的地图,谷歌的邮件,开启了一个web前端的新时代。
一旦前端应用需要从后端获取数据,这个时候就意味着前端在运行时要动态的渲染这个内容的,
这个时候就变成了数据模型和视图层的解耦合,这个时候前端开发人员需要做两件事情,一件是动态的生成HTML,先由后端返回前端需要的基本HTML,然后前端再动态的替换页面的DOM元素,这个时代JQuery提供了便捷DOM操作方法和异步请求方法,这个时候前端写好模板逻辑,再由后端提供数据,最后把页面渲染出来
这个时代还有一个变化是模板分离,前端的模板不再使用HTML,而是使用Mustache这样的模板引擎来动态生成HTML。
MVC架构
由于HTML变成了动态生成,然后模板独立分离,这时前端的应用开始复杂起来,后端的MVC框架进一步影响到了前端的开发。这时候诞生了一些早期的MVC框架,如Backbone、Knockout
到2009年,nodejs出现了,改善了前端的工程能力,这时候出现了更好的构建工具:Grunt、Gult,
包管理工具:Bower、NPM以及模块管理工具:AMD、CommonJS
Node.js
随着单页面应用的流行,前后端的架构分离成为了行业内的标准事件,这个时候前端进入了下一个新的时代,这时候前端需要考虑的内容也越来越多,首先在与后端的协同上,采用了例如Swagger这样的api管理工具,各种各样的mock server(模拟数据服务)也成为了标准事件。
与此同时MVC渐渐满足不了开发需求,这个时候组件化开始变得流行,前端应用从此从一个个细小的组件组合而成,而不再是一个大的一个页面组件来全盘处理
出现了Angular、vue这类优秀的前端框架
大前端
最后还出现了大前端的概念,由前端开发跨平台的移动应用,采用例如react rative flutter等前端框架
复杂的应用发展了这么久,这时候就需要去对一些遗留的应用进行演进和维护,我们需要考虑如何去重写、迁移、重构等等
当组件化+MVC也无法应对现在这种组件化、八爪鱼式的应用时,微前端就出现在了我们面前,微前端主要解决了以下几个问题:
1、跨框架:如何在一个页面上同时运行和使用多个前端框架
2、拆分:如何将一个复杂的应用拆分成多个微小的应用,复用到其他的应用上。有点类似与客服中的微服务的概念
3、遗留系统的迁移,如何将旧的前端框架嵌入到现有的应用中去运行。