从Vue.js窥探前端行业

近年来前端开发趋势

1.旧浏览器逐渐淘汰,移动端需求增长:css

旧浏览器主要指的是IE6-IE8,它是不支持ES5特性的;IE9+、chrome、sarafi、firefox对ES5是彻底支持的,移动端大部分浏览器是基于webkit内核,因此ES5在移动端也是全面支持的,所以vue能够在移动端以及现代浏览器中大显身手。html

                                        

2.前端交互愈来愈多,功能愈来愈复杂:前端

如今的前端可谓是一应俱全,好比高大上的技术库和框架、酷炫的运营活动页面、H5小游戏,固然前端技术的应用在更多具备商业价值的应用上,好比下图。vue

                                            

 

3.架构从传统后台MVC向REST API+ 前端 MV*(MVC、MVP、MVVM) 迁移react

在传统的MVC下,当前前端和后端发生数据交互后会刷新整个页面,从而致使比较差的用户体验。所以咱们经过Ajax的方式和后端REST API做通信,异步的刷新页面的某个区块,来优化和提高体验,同时把MVC拿到前端来作git

MVVM框架

1.MVVM框架基本概念:它主要包括各部分View、ViewModel、Model,以下图。在MVVM架构下,视图和数据是不能直接通信的,它会经过ViewModel这个中间件来通信。ViewModel起的是一个观察者的职位:当数据变化,ViewModel观察到变化,并通知视图作相应的更新;而用户操做视图,ViewModel也能监听到变化,而后通知数据作改动,从而实现了数据的双向绑定。github

               

2.MVVM框架的应用场景web

MVVM框架针对具备复杂交互逻辑的前端应用,它提供了基础的架构抽象,而且经过Ajax数据持久化,保证前端用户体验。vue-router

因此MVVM框架的好处显而易见:当前端对数据进行操做的时候,能够经过Ajax请求对数据持久化,而没必要刷新整个页面,只需改变dom里须要改变的那部分数据内容。特别是在移动端,刷新页面的代价太昂贵。虽然有些资源会被缓存,可是页面的dom、css、js都会被浏览器从新解析一遍,所以移动端页面一般会被作成SPA单页应用。由此在这基础上诞生了不少MVVM框架,好比Angular.js、react.js、vue.js。chrome

Vuejs以及其生态

vue.js是由国内的大牛尤雨溪为主要开发的,它起初是我的项目,在2014年初开源就受到普遍关注。起初尤大神把它定位是一个视图库而非框架,但随着vue-router,vue-resource等第三方库的发展,Vuejs逐渐成长为一个框架。

1.它是一个轻量级MVVM框架(只有20来kb)

2.核心思想

  ①数据驱动:数据(model)改变驱动视图(view)自动更新,DOM是数据的一种天然映射

  ②组件化:扩展HTML元素,封装可重用的代码

4.github超过35K+的star数,社区完善 

Vue vs Angular React 

Vue官网已对各个主流框架进行了比较详细的对比分析(中文版地址),下面进行简单地总结下;

Vue.js更轻量,gzip后大小只有20k+。Angular有56K,React有44K。

Vue.js相对来讲学习曲线比较平稳。

Vue.js吸收了两家之长,借鉴了Angular的指令和react的组件化。

相关文章
相关标签/搜索