今天参与了满帮的一个大前端的一个技术沙龙，并结合掌握的相关知识做一些总结探索，相关截图可能不是特别清楚

1.Flutter跨平台的优势和不足

image.png

1. Flutter跨平台是直接面向渲染引擎的，比RN少了一些中转层，性能方面更加出色
2. Flutter通过渲染引擎直接渲染，所以多端UI更加一致
3. Flutter本身不支持动态下发

2. Flutter动态化实现方案

image.png

• 通过编译产物下发,这个是我们正常理解的动态化或者热更新，由于苹果政策原因，暂时不可行
• 配置json和dart模板匹配或者部分逻辑交给js处理
• 通过定义一套新的类似于React的声明形式语法来定义UI，再解析转换为json,再由dart解析，形成Flutter三颗树中的第一个widget tree,这也是满帮实现的方式（Thresh,感兴趣的可以到github看看）

3. Thresh实现原理

image.png image.png image.png image.png image.png

• Flutter三颗树具体细节可以看我底部的参考资料，这里我自己简单粗略白话说下
  还记得我们app的main函数的runApp吗？它接收一个Widget,所有的页面其实都不过是一个大的Widget,她好比一个大配置文件，做过React开发的同学都知道虚拟DOM和真实DOM，不错，这个大配置文件相当于虚拟DOM，这就是widget tree
  widget tree生成的同时，相应会有一个真实的DOM，这就是ElementTree,差异化更更新就是在这里
  每个Widget最终会有个RenderObject 它也会产生树，布局产生图像数据，最后光栅化，显示在屏幕上

• 满帮的方案其实是用一个动态化文件如json,构建widget tree,也就是具有层级嵌套关系的多个widget 组合，这里和正常编写widget tree有所不同，在性能指标方面存在进一步验证的空间，比较我们正常的widget tree的编译产品要更加直接，目前我也不确定，需要实验对比...

4. 其他

• 标准化组件可以加快开发节奏，例如日历控件应该就一种(不完全排除差异化)
• 动态化发布意思就是动态下发一些如RN的Bundle,或者json文件，实现模块化更新，而不需要重新发版本
• 在框架之上再附加一层实现动态化应该谨慎使用，除非动态化很重要
• Flutter Web我想有可能可以用来Flutter 动态化能力不足的问题，后续再专门考虑吧

参考资料:
1.Flutter原理：三棵重要的树(渲染过程、布局约束、应用视图的构建等)

2.Flutter 中文网 架构总览