小程序开发框架

308 阅读2分钟

taro生成的代码在微信小程序开发工具调试时,发下AppData功能是无法使用的,已经不是本身页面的data数据结构。后来发现,taro是基于taro runtime运行时来跑起来的。有了后面的原理学习。

原文链接 blog.csdn.net/Y0W1as5eg37…

按实现原理分类

从实现原理上,开源社区的跨端框架大致分为下面两类:

compile time 编译时

runtime 运行时

compile time 编译时的跨端框架,主要的工作量在编译阶段。他们框架约定了一套自己的 DSL ,在编译打包的过程中,利用 babel 工具通过 AST 进行转译,生成符合小程序规则的代码。

这种方式容易出现 BUG ,而且开发限制过多。早期的 Taro 1.0 和 2.0 的版本就是采用的这种方案,下文会有更具体的介绍。

而另外一种runtime 运行时模式, 跨端框架真正的在小程序的逻辑层中运行起来 React 或者是 Vue 的运行时,然后通过适配层,实现自定义渲染器。这种方式比静态编译有天然的优势,所以 Taro 的最新 Next 版本和 Remax 采用的是这种方案

原文(然后,我们会:基于组件的 template,动态 “递归” 渲染整棵树。 具体流程为先去遍历 Taro DOM Tree 根节点的子元素,再根据每个子元素的类型选择对应的模板来渲染子元素,然后在每个模板中我们又会去遍历当前元素的子元素,以此把整个节点树递归遍历出来。)

微信原生支持template属性,taro根据此特性,将taro的虚拟DOM树对象组合为root,通过setData赋值给页面数据,然后驱动页面根据template,遍历当前元素的子元素,以此把整个节点树递归遍历出来。

image.png