1、什么是小程序
小程序是介于web网页应用和原生应用的一种产物;小程序类web,但不是HTML5;即用即走,随手可得;拥有离线能力;基于微信跨平台。
2、小程序架构
(1)小程序主要模块构成
小程序自身分为两个主要部分独立运行:view 模块和 service 模块。在开发者工具中,它们独立运行于不同的 webivew tag 中。
view 模块负责前端界面显示,它由 wxml 和 wxss 转换后代码以及微信提供相关辅助模块组成。 一个 view 模块对应一个 页面, 小程序支持同时多个 view 存在。
service 模块负责后台逻辑,它由 js 代码以及微信提供的相关辅助模块组成。 一个应用只有一个 service 进程,它同样也是一个页面。它在程序生命周期内后台运行,service 模块通过与 view 模块实现不同但接口格式一样的微信JSBridge 对象跟后台通信。
上图是微信小程序视图层和逻辑层的结构示意图。可以看到:
视图层和逻辑层分离,通过数据驱动,事件交互,不直接操作DOM;视图层负责渲染页面结构,逻辑层负责逻辑处理、数据请求、接口调用等。
视图层与逻辑层通过数据data和事件event进行通信,逻辑层提供数据给视图层,视图层通过绑定/捕获事件发起交互让逻辑层处理视图使用WebView渲染,JS由JSCore(IOS)/ X5(Android) /nmjs(DevTool)渲染解析
(2)小程序模块间通信
上图是小程序模块通信情况图,可以清楚地看到视图层及逻辑层之间的通信结构。
3、小程序的生命周期
用一下实例来观察页面的生命周期:
由上图可知,小程序由两大线程组成:负责界面的视图线程和负责数据、服务处理的服务线程,两者协同工作,完成小程序页面生命周期的调用。
(1)视图线程有四个状态:
初始化状态:初始化视图线程所需要的工作,初始化完成后向 “服务线程”发送初始化完成信号,然后进入等待状态,等待服务线程提供初始化数据。
首次渲染状态:当收到服务线程提供的初始化数据后,渲染小程序界面,渲染完毕后,发送“首次渲染完成信号”给服务线程,并将页面展示给用户。
持续渲染状态:此时界面线程继续一直等待“服务线程”通过界面数据,只要收到就重新局部渲染,因此只要更新数据并发送信号,界面就自动更新。
结束状态:页面被回收或者销毁、应用被系统回收、销毁时触发。
(2)服务线程五个状态:
初始化状态:此阶段仅启动服务线程所需的基本功能,比如信号发送模块。系统的初始化工作完毕,就调用自定义的onload和onshow,然后等待视图线程的“视图线程初始化完成”。
等待激活状态:接收到“视图线程初始化完成”信号后,将初始化数据发送给“视图线程”,等待视图线程完成初次渲染。
激活状态:收到视图线程发送来的“首次渲染完成”信号后,就进入激活状态既程序的正常运行状态,并调用自定义的onReady()函数。此状态下就可以发送界面数据给界面线程进行局部渲染,更新页面。
后台运行状态:如果界面进入后台,服务线程就进入后台运行状态,
结束状态:页面被回收或者销毁、应用被系统回收、销毁时触发。