由于微信小程序是在vue.js和react.js之后诞生的，他们在设计代码架构时借鉴了vue.js和react.js的思想，遵循组件化的方法，并扩展了setData的机制，将视图层和逻辑层连接成一个“中转站”。但是这种机制总有性能问题，微信小程序也不例外。先看一张：的图片。

此图概括描述了setData的工作原理。当程序开始触发setData操作时，首先以字符串的形式传输数据，同时将转换后的数据拼接成js脚本。接下来，js脚本全部由双方提供的evaluateJavascript实现。那为什么要用webview和javascriptCore分别实现呢？先告诉我这两个是干什么用的。

webview和JavascriptCore

微信打开小程序时，会先启动两个线程，一个是查看线程，一个是AppService线程。一般来说，前者是视图层，后者是逻辑层。它们是独立的，功能不同，但并行运行，小程序的页面显示嵌套在webview中。

applet条目文件app.js中有一个pages配置项，例如：

第：页[

页面/索引栏'，

页面/朋友/朋友

]

这里配置了多少页，小程序会预加载多少页对应的webview，这是view Thread完成的操作。同时，AppService Thread也在逻辑层面加载相应的页面，会根据小程序的生命周期依次做逻辑操作。这里还会有与view Thread的数据传输交互。下图可以详细描述同时查看Thread和AppService Thread加载页面的所有进程。

在架构上，WebView和JavascriptCore是独立的模块，数据不能直接共享。为了共享数据，WebView和JavascriptCore都提供了evaluateJavascript来实现。(不是很久以前安卓上提供的evaluateJavascript调用js操作，而是sdk19上面使用的evaluateJavascript方法)

使用上述机制，setData中存在一些性能问题。如果频繁调用，WebView和JavascriptCore的并发执行会导致用户体验被卡住。为了降低性能开销，建议尽可能合并集合数据：

123

this . setdata({ one : ' 1 ' })this . setdata({ two : ' 2 ' })this . setdata({ three : ' 3 ' })

修改为：

this.setData({ one:'1 '，two:'2 '，three: ' 3 '，})

这减少了拼接js脚本的数量，从而提高了性能。

在Taro小程序框架中更新数据时调用的setState是一种异步方法，对同一事件自动重复调用SetState，然后进行合并处理，还对数据进行diff优化，自动剔除那些没有变化的数据。