微信小程序梳理学习

小程序宿主环境：

1. 渲染层：wxml、wxss 通过webview渲染，多页面对应多webview线程

   a. 初始化时，载入相关代码，等待逻辑层初始化完毕+接收数据，渲染页面

   b. 启用初始渲染缓存，视图层则不必等逻辑层加载完，可提前将data渲染结果给用户的时间

    1. 首次打开页面，初始数据渲染结果记录并写入持久化缓存区
    2. 二次打开时，先检查缓存区渲染结果，有则直接展示
    3. 逻辑层初始化完毕后可响应用户事件
    4. 初始渲染缓存可以快速展示静态数据、骨架页、加载提示、预展示广告
    5. 初始渲染缓存阶段，复杂组件不能被展示和响应交互，自定义组件则无影响
    6. 启动方式：app.json或页面.json增加配置initialRendingCache: static
    7. initialRendingCache：dynamic 则可额外展示可变内容+this.setInitialRenderingCache( 动态数据)启动缓存，这种方式开销大，会进行俩次渲染
    8. setInitialRenderingCache 需在onready后调用
    9. 禁用初始动态缓存时对setInitialRenderingCache传入null即可
   

2. 逻辑层：js脚本，通过jscore线程渲染

   a. 初始化时，载入代码，将数据发给视图层

   b. 冷启动进入首页较慢

3. 这个俩个线程相互独立，同浏览器中的互斥不同，因此更高效，响应更流畅

4. 俩个线程通信和网络请求都需要经过微信客户端native中转

5. 小程序分三个宿主：iOS、安卓、开发者工具，其对应的逻辑层和渲染层均不同:

   a. 逻辑层：iOS是jscore，安卓是v8, 开发者工具是nwjs

   b. 渲染层：iOS是wkwebview, 安卓是chromium内核，开发者工具是Chrome webview

微信客户端打开小程序前，先下载小程序代码包到本地，然后通过app.json中的pages字段获取所有页面路径，然后加载首页代码并渲染，然后执行onlaunch

整个小程序只有一个APP实例，所有页面共享

小程序优点：原生体验、快速加载、能力强大、简单高效