小程序1(相关概念）

小程序结构划分
一个App 由多个 page组成，一个page由多个组件组成
组件又分为内置组件和自定义组件
App组成：
app.js 创建app实例的代码
app.json 全局的一些配置 整个小程序的入口
app.wxss 全局的一些样式配置
Page组成：
page.js 创建Page实例的代码
page.json 业务单独的配置
page.wxml 页面的wxml布局代码
page.wxss 页面的样式配置
Component组成：
component.js 创建component实例的代码
component.json 组件内部的配置，比如当前组件使用了别的组件
component.wxml 组件的wxml布局代码
component.wxss 组件的样式配置
在微信开发者工具中创建一个app.json作为页面入口，在pages文件夹中创建多个pages文件about和home
app.json 需要添加页面入口

小程序的MVVM架构
M:Model
V:View
VM:View Model

配置文件
微信有四个配置文件
project.config.json：对项目进行配置
sitemap.json：决定用户能否在小程序搜索栏搜得到特定的小程序
app.json:全局配置
page.json:对于某个页面进行专属配置
project.config.json官方文档
sitemap.json官方文档
app.json官方文档
page.json官方文档

小程序的双线程
小程序的宿主环境：微信客户端
宿主环境为了执行小程序的各类文件，提供了双线程模型
双线程模型：渲染层 逻辑层

渲染层：wxml模板和wxss样式运行在此层，使用WebView线程渲染
逻辑层：Js脚本运行在此层，使用jscore运行Js脚本
这两层通过微信客户端（native)中转交互

界面渲染过程：
1、渲染层：宿主环境将wxml转化为JS对象
2、Js对象转为真正的Dom树，webView进行渲染显示为页面
3、当数据发生改变时，逻辑层提供最新的变化数据，js对象使用diff算法进行比较
4、将最新变化的内容反映到真实的Dom树，更新UI



启动流程
微信不会将所有小程序内置，所以当我们使用一个小程序时背后的流程如下

app.js里有一个App()函数，是由小程序自己调用的，App()函数里可以写一些生命周期函数

app.js里的app函数内容如下：

App({

  /**
   * 当小程序初始化完成时，会触发 onLaunch（全局只触发一次）
   */
  onLaunch: function () {
    
  },

  /**
   * 当小程序启动，或从后台进入前台显示，会触发 onShow
   */
  onShow: function (options) {
    
  },

  /**
   * 当小程序从前台进入后台，会触发 onHide
   */
  onHide: function () {
    
  },

  /**
   * 当小程序发生脚本错误，或者 api 调用失败时，会触发 onError 并带上错误信息
   */
  onError: function (msg) {
    
  }
})