昨晚在想如果面试被问到前端框架,可以说些什么,于是把对框架的思路理了一遍。
最初接触到vue因为vue在2016年实在太火了。当时觉得那三个经常并列提到的框架angular, react, vue,是时候该了解一点了吧,就挑了vue。
这些前端框架听起来很复杂,又是SPA又是虚拟DOM,很容易就把人搞晕。然后,幸亏我当时晕了,及时放下来。等熟悉了后端再来看它,我就直接用『能花样绑定数据的模板引擎』来定义它了,就是这么一回事儿嘛。
当时我在查找该去学习哪个框架的时候就看见有人说,不是为了学框架而去学框架,要弄明白框架是为了解决什么问题而出现的。当时我觉得答案是SPA,后来才意识到,SPA的出现,是因为有了AJAX,解决了异步请求、无缝刷新的问题。只要有AJAX,SPA就能做出来,这和框架并无联系。一个基础页面,想要其他页面就在它基础上进行各种局部刷新,把原先DOM节点扔掉,换成AJAX请求到的后端渲染好的那一小部分插进去。好了,到了这一步,问题才会出现。
虽然SPA完成了,但是对DOM的大量操作显然不是件简洁的事,需要更合适地组织JavaScript代码。『设计模式』 就是干这个的。MVVM把MVC的C,controller换成VM,view-model。换了什么?原来是单向的,在C的控制下,M改变,V同步更新。但是SPA实现的时候,不是一个模板引擎把M渲染成V就完事了,最好让M与V同步,于是把M和V都绑定到一个叫VM的东西上,不但M更新V,V的变动还会对M有影响(不完全准确,但这里不展开)。
回到原先那个SPA,用上MVVM之后,页面(即使是一部分)在后端被渲染出来,到了前端还要作为M被渲染一次,干脆后端只提供数据,渲染全交给前端,还能推动前后端分离。最终这些前端MVVM框架就火了。
框架就是做了这样一件事,虽然各框架明确介绍就是用来数据绑定的,但是如果像我当时那样还是不理解框架的意义,误解成做SPA的工具,那就走了弯路。不管什么项目vue脚手架,react全家桶就招呼上了。vue开发文档开始就介绍,vue可以用简单引入vue.js文件的方式直接使用。我当时想,没有路由没有分组件开发,这个东西单独用能干嘛。vue的作者听了一定很委屈,这个框架本来就是实现数据绑定这么件小事的啊。