编译到各平台的小程序代码中的view部分，为什么要用template 的方式实现？

[lunyong]

如题，taro3编译后的源码的视图部分都是 template 的方式实现的，搞得base里面一大坨看不懂的代码，为啥要这么搞呢？为啥不像taro1那样各个页面分开呢？
另外，代码编译到快手平台之后，flex:1是不生效的，而快手原生生效，不知道和这种实现方式是否相关？

[Chen-jj]

使用 react、vue 开发后，会在逻辑层得出一颗虚拟 dom 树，但小程序渲染层的 dom 结构（wxml）是要提前写死的，所以只能用 <template> 模拟节点，运行时根据 dom 树的数据递归渲染。

taro 1、2 是把 React JSX 直接编译转换成 wxml，并不是在运行 React。

Taro 1、2 和 3 的不同实现方案是对开发体验和性能间的权衡结果。

快手 flex 不生效，大概是和百度小程序一样，template 在逻辑层被编译成一个正真的节点了。

例如：

<template>
  <view style="display: flex">
    <template>
      <text style="flex: 1">
        Hello World!
      </text>
    </template>
  </view>
</template>

在其它小程序的渲染结果：

<view style="display: flex">
  <text style="flex: 1">
    Hello World!
  </text>
</view>

在快手小程序的渲染结果：

Hello World! ```

view 和 text 间多了一个真实存在的 template 节点，导致 flex 失效。

[lunyong]

好的，感谢大佬解惑！那快手这个flex问题，有办法解决吗？

[Chen-jj]

需要参考 @tarojs/plugin-platform-swan 中对百度小程序的兼容操作，对应修改快手小程序插件

[lunyong]

官方能维护更新一下快手小程序的插件吗？实在搞不懂template里面buildFlattenView之类的方法是干啥的。。。

[voidman2017]

有关通过虚拟dom树产生渲染数据结合template模板渲染的设计有相关文档进行介绍么，最近在查看这部分源码，不是很理解其中的设计思路

[voidman2017]

@Chen-jj