微信小程序开发（二）：了解小程序运行的基本概念

微信客户端给小程序提供的环境称为宿主环境，小程序借助宿主环境提供的能力，可以完成一些普通网页无法完成的功能。

渲染层和逻辑层

1、小程序的运行环境分为渲染层和逻辑层，其中WXML和WXSS工作在渲染层，JS脚本工作在逻辑层
2、渲染层和逻辑层分别由2个线程管理，渲染层的界面使用WebView进行渲染，逻辑层使用JSCore线程运行JS脚本
3、小程序存在多个界面，所以渲染层存在多个WebView线程，渲染层和逻辑层的通信会经由微信客户端做中转，逻辑层发送网络请求也经由微信客户端转发

程序与页面

小程序运行时发生了什么

1、微信客户端在打开小程序之前，会把整个小程序的代码包下载到本地
2、紧接着通过app.json的page字段可以知道当前小程序的所有页面路径
3、如果没有特别指定，pages字段的第一个页面是这个小程序的首页
4、微信客户端加载首页代码，通过小程序底层机制渲染出小程序首页

{
  "pages":[
    "pages/index/index",
    "pages/logs/logs"
  ]
}

1、小程序启动后，app.js中App实例的onLaunch回调函数会被执行
2、整个小程序只有一个 App 实例，是全部页面共享的

App({
  onLaunch: function () {
    // 小程序启动之后 触发
  }
})

小程序的页面如何渲染

一个小程序的页面包含了4种文件，微信客户端会先根据 .json 配置生成一个界面，顶部的颜色和文字你都可以在这个 json 文件里边定义好。紧接着客户端就会装载这个页面的 WXML 结构和 WXSS 样式,最后客户端会装载 .js。

.js文件的大概内容：

Page({
  data: { // 参与页面渲染的数据
    logs: []
  },
  onLoad: function () {
    // 页面渲染后 执行
  }
})

1、Page是一个页面构造器，这个构造器生成了一个页面，在生成页面时，小程序框架会把data数据和.wxml一起渲染出最终的页面结构
2、界面渲染完成后，Page会执行onLoad回调函数，我们可以在回调函数中处理逻辑
3、onLoad是开发中最常用的一个周期函数，除此之外还有其他一些回调函数