移动端架构那些事

真正的快乐，不是狂喜，亦不是苦痛，它是细水长流，碧海无波，芸芸众生里做一个普通人，享受生命一刹那的喜悦。

好久没有写点什么了，今天就来说说移动端架构的那些事儿吧。先来看看移动互联网的发展史，看下图

从这个图就可以看出，移动互联网从最开始的wap网页经历了原生App，混合App，以及RN和Weex的阶段,一次又一次的技术革新其实背后都是伴随着用户对软件体验的要求越来越高。对于开发团队而言，效率和成本亦是至关重要，我想任何一个leader都希望在最短的时间用最低的成本去创造最大的价值吧。

虽然网上亦很多各类技术对比的文章，在此我还是造一下轮子列出各种技术的优缺点：

一目了然，so当下的app应当具备哪些能力才能留住流量屹立不倒呢？

我认为一个好的app应当具备以下特点

质量效率及性能不必多说，我来说说其他几点：

动态性：举个栗子，如果发现线上bug,通过传统方式修改之后必须要重新打包发布应用市场，用户安装等一系列流程，一次两次没什么所谓，次数多了，用户肯定就会卸载掉你这个“辣鸡“软件了，如果能够在用户没发现的时候，不知不觉的就修复了问题，是不是很爽，这就是动态性了。

跨平台：说白了就是一套代码多端运行，极大的节约了开发成本。

模块化：当一个APP的体量比较大的时候，比如携程等，每一块的业务都由不同的团队来维护和开发，那就必须要确保各个模块的独立性、完整性以及共同联系的可能，那就得思考如何构造一个容器来支撑业务的模块化~

看完以上说明应该差不多都了解清楚了，现在简单介绍一下当下流行的一些APP开发技术

Hybrid:混合开发模式即原生+h5，用图来说原理

比较流行的 Hybrid开发框架：Cordova/PhoneGap、AppCan、Hbuilder,当然还有笔者自己实现的山寨版Hybrid框架（这里就不赘述了）

ReactNative的口号是 Learn once write anywhere

Weex的口号是Write once run anywhere

仔细一看这两句话其实不冲突，Weex是基于ReactNative的成果之下诞生的，如果非要说两则的区别，那么就是Weex要狂一点，做得彻底一点~

来看看Weex的架构图

我简单解释下，我们都知道浏览器可以加载H5解决了动态性的问题，但是他的渲染机制决定了其体验和原生比较相却甚远；而Weex呢就改变了渲染机制，采用Vue作为前端开发语言，通过转换器转换成JSBundle，然后用JS引擎去解析，最后用原生控件来进行渲染，既解决了动态性的问题又保证了原生的体验，并且也最大程度的做到了跨平台化。

各类主流技术都讲得差不多了（原生插件化这里就不多说了不能跨平台），最后奉献一张自己理解的移动端框架的架构图，希望能够对在路上摸索前行的朋友有所启迪~