#e:7:e:f:9:a:c:f:f:7:0:8:6:f:6:0:8:7:e:c:6:e:1:e:e:6:a:6:f:e:c:4#
小程序简介
小程序提供了一个简单、高效的应用开发框架和丰富的组件及API，帮助开发者在陌陌中开发具有原生APP体验的服务。
网页开发渲染线程和脚本线程是互斥的，这也是为何长时间的脚本运行可能会造成页面丧失响应，而在小程序中，两者是分开的，分别运行在不同的线程中。
网页开发者可以使用到各类浏览器曝露下来的DOMAPI，进行DOM选中和操作。而如上文所述，小程序的逻辑层和渲染层是分开的，逻辑层运行在JSCore中，并没有一个完整浏览器对象，因此缺乏相关的DOMAPI和BOMAPI。
#a:0:5:0:6:b:0:a:0:2:b:0:d:8:8:4:1:4:7:3:3:0:f:e:1:3:6:b:4:3:7:c#
网页开发者在开发网页的时侯，只须要使用到浏览器，但是搭配上一些辅助工具或则编辑器即可。小程序的开发则有所不同，须要经过申请小程序账号、安装小程序开发者工具、配置项目等等过程方可完成。
小程序的运行环境分成渲染层和逻辑层，其中WXML模板和WXSS式样工作在渲染层，JS脚本工作在逻辑层。
小程序的渲染层和逻辑层分别由2个线程管理：渲染层的界面使用了WebView进行渲染；逻辑层采用JsCore线程运行JS脚本。一个小程序存在多个界面，所以渲染层存在多个WebView线程，这两个线程的通讯会经由陌陌顾客端（下文中也会采用Native来代指陌陌顾客端）做中转，逻辑层发送网路恳求也经由Native转发，小程序的通讯模型右图所示。
#0:c:1:4:7:d:f:d:c:3:1:9:d:c:c:c:9:1:1:9:b:0:3:7:e:8:d:c:e:d:3:4#
初始渲染缓存工作原理
小程序页面的初始化分为两个部份。
1.逻辑层初始化：载入必需的小程序代码、初始化页面this对象（也包括它涉及到的所有自定义组件的this对象）、将相关数据发送给视视口。2.视视口初始化：载入必需的小程序代码，之后等待逻辑层初始化完毕并接收逻辑层发送的数据，最后渲染页面。
在启动页面时，尤其是小程序冷启动、进入第一个页面时，逻辑层初始化的时间较长。在页面初始化过程中，用户将见到小程序的标准载入画面（冷启动时）或可能看见轻微的死机现象（页面跳转过程中）。
启用初始渲染缓存，可以使视视口不须要等待逻辑层初始化完毕，而直接提早将页面初始data的渲染结果展示给用户，这可以促使页面对用户可见的时间大大提早。它的工作原理如下：
1.在小程序页面第一次被打开后，将页面初始数据渲染结果记录出来，写入一个持久化的缓存区域（缓存可长时间保留，但可能由于小程序更新、基础库更新、储存空间回收等诱因被消除）；2.在这个页面被第二次打开时，检测缓存中是否还存有这个页面上一次初始数据的渲染结果，假若有，就直接将渲染结果展示下来；3.假如展示了缓存中的渲染结果，这个页面暂时还不能响应用户风波，等到逻辑层初始化完毕后才会响应用户风波。
借助初始渲染缓存，可以：
1.快速展示出页面中永远不会变的部份，如导航栏；2.预先展示一个骨架页，提高用户体验；3.展示自定义的加载提示；4.提早展示广告，等等。
WXS
WXS（WeiXinScript）是小程序的一套脚本语言，结合WXML，可以建立出页面的结构。
WXS与JavaScript是不同的语言，有自己的句型，并不和JavaScript一致。因为运行环境的差别，在iOS设备上小程序内的WXS会比JavaScript代码快2~20倍。在android设备上两者运行效率无差别。
背景：有频繁用户交互的疗效在小程序上表现是比较卡顿的，比如页面有2个元素A和B，用户在A上做touchmove手势，要求B也跟着联通，movable-view就是一个典型的事例。一次touchmove风波的响应过程为：
a、touchmove风波从视视口（Webview）抛到逻辑层（AppService）
b、逻辑层（AppService）处理touchmove风波，再通过setData来改变B的位置
一次touchmove的响应须要经过2次的逻辑层和渲染层的通讯以及一次渲染，通讯的历时比较大。据悉setData渲染也会阻塞其它脚本执行，造成了整个用户交互的动漫过程会有延后。
小程序的框架分为视视口（Webview）和逻辑层（AppService），这样分层的目的是管控，开发者的代码只能运行在逻辑层（AppService），而WXS这个思路就必需要让开发者的代码运行在视视口（Webview）
#c:2:8:9:c:b:2:5:a:5:2:f:3:8:4:d:9:3:6:e:8:d:2:c:3:0:0:b:1:c:8:5#
WXS运行在视视口（Webview），上面的逻辑虽然能做的风波比较少，须要有一个机制和逻辑层（AppService）开发者的代码通讯，使用callMethod是WXS上面调用逻辑层（AppService）开发者的代码的方式，而WxsPropObserver是逻辑层（AppService）开发者的代码调用WXS逻辑的机制。
使用WXS函数拿来响应小程序风波，目前只能响应外置组件的风波，不支持自定义组件风波。WXS函数的不仅纯逻辑的运算，还可以通过封装好的ComponentDescriptor实例来访问以及设置组件的class和款式，对于交互动漫，设置style和class足够了。
worklet动漫
小程序采用双线程构架，渲染线程（UI线程）和逻辑线程（JS线程）分离。JS线程不会影响UI线程的动漫表现，如滚动疗效。但引入的问题是，UI线程的风波发生后，需跨线程传递到JS线程，从而触发开发者反弹，当作交互动漫（如拖动元素）时，这些异步性会带来较大的延后和不稳定。
worklet动漫正是为解决这类问题而诞生的，致使小程序可以做到类原生动漫般的体验。
示例一：运行在UI线程
#9:0:6:5:4:4:7:4:6:0:2:3:1:5:9:9:1:8:4:f:a:d:a:8:b:7:5:f:3:2:4:4#
使用worklet动漫能力时，确保开发者工具右上角>详情>本地设置里的将JS编译成ES5选项被勾选上(代码包容积会少量降低)。
