微信小程序的架构原理

小程序上线以来，一向被称为“便携版”的APP，关于两者之间的区别，无外乎小程序相对轻便、开发成本低，下面让我们来看一下小程序的“庐山真面目”！

一、app的分类

大致可以分为这3种：

native app（原生app）、web app、hybrid app（混合app），关系如下图：

二、什么是小程序

小程序是介于web网页应用和原生应用的一种产物；

小程序的特点：

三、小程序架构

视图层和逻辑层分离，通过数据驱动，事件交互，不直接操作DOM

视图层负责渲染页面结构，逻辑层负责逻辑处理、数据请求、接口调用等

视图层与逻辑层通过数据和事件进行通信，逻辑层提供数据给视图层，视图层通过绑定/捕获事件发起交互让逻辑层处理

视图使用WebView渲染，JS由JSCore(IOS)/X5(Android)/nmjs(DevTool)渲染解析

JSBridge下架起上层开发与Native（系统层）的桥梁，使得小程序可通过API使用原生的功能，且部分组件为原生组件实现，从而有良好体验。实现了对底层API接口的调用，所以在小程序里面开发，开发者不用太多去考虑OS的实现差异的问题，安心在上层的视图层和逻辑层进行开发即可。

数据通信机制：

分为数据单项绑定、事件绑定。

四、小程序项目结构

约定优于配置（convention over configuration），也称作按约定编程，是一种软件设计范式，旨在减少软件开发人员需做决定的数量，获得简单的好处，而又不失灵活性。

五、小程序生命周期

小程序的生命周期分为应用生命周期和页面生命周期

应用生命周期：

属性 类型 描述 触发时机
onLaunch Function 生命周期函数–监听小程序初始化 当小程序初始化完成时，会触发 onLaunch（全局只触发一次）
onShow Function 生命周期函数–监听小程序显示 当小程序启动，或从后台进入前台显示，会触发 onShow
onHide Function 生命周期函数–监听小程序隐藏 当小程序从前台进入后台，会触发 onHide

页面生命周期：

Page()函数用来注册一个页面。接受一个 object 参数，其指定页面的初始数据、生命周期函数、事件处理函数等。