YPE htmlhtml lang=enhead data-n-head-ssrtitle data-n-=true请问是否有官方的小程序整体架构图？ 微信开放社区米乐体育APP官网

　　如题，网络上能够搜索到大量个人和培训机构绘制的架构图，有些是过于简单浮于表面，有些不够专业，想请问是否有官方的架构图能够参考？

　　其中渲染层用了Webview进行渲染，开发者的JS逻辑运行在一个独立的JSCore线程。

　　渲染层提供了带有数据绑定语法的WXML，逻辑层提供了setData等等API，开发者需要进行界面变化时，只需要通过setData把变化的数据传进去，小程序框架就会进行Dom Diff等流程最后把正确的结果更新在Dom树上。

　　可以看到在开发者的逻辑下层，还需要有一层小程序框架的支持（数据通信、API、VD算法等等），我们把它称为基础库。

　　我们在两个线程各自注入了一份基础库，渲染层的基础库含有VD的处理以及底层组件系统的机制，对上层提供一些内置组件，例如video、image等等。逻辑层的基础库主要会提供给上层一些API，例如大家经常用到的wx.login、wx.getSystemInfo等等。

　　用户在屏幕点击某个按钮，开发者的逻辑层要处理一些事情，然后再通过setData引起界面变化，整个过程需要四次通信。对于一些强交互（例如拖动视频进度条）的场景，这样的处理流程会导致用户的操作很卡。

　　对于这种强交互的场景，我们引入了原生组件，这样用户和原生组件的交互可以节省两次通信。

　　正如上图所示，原生组件和Webview不是在同一层级进行渲染，原生组件其实是叠在Webview之上，想必大家都遇到过这个问题，video、input、map等等原生组件总是盖在其他组件之上，这就是这个设计带来的问题。

　　我们也很重视这个问题，经过了一段时间的努力，我们攻克了这个难题，把原生组件渲染到Webview里，从而实现同层渲染。目前video组件已经完成同层渲染的全量发布，详细可以看我们之前的公告：同层渲染公测。

　　为了让开发者可以更好的开发小程序，我们在后来还引入了自定义组件和插件的概念，我们后续会有相关的文章再介绍这两块的设计，希望大家关注我们社区的文章板块。

　　官方收录管理: 小程序/开发/服务端/小程序直播/直播间管理/官方收录管理

　　接口说明: 小程序/开发/服务端/小程序直播/直播间管理/官方收录管理

　　调用方式: 小程序/开发/服务端/小程序直播/直播间管理/官方收录管理

　　调用示例: 小程序/开发/服务端/小程序直播/直播间管理/官方收录管理