Flutter原理

react native
以js语言，通过中间层转换，最终渲染到Native层，性能相对较好
采用了JavaScript语言、JSCore引擎和通过原生渲染的跨平台框架

实现原理 通过编写JavaScript语言代码，通过 React Native 的中间层来调用 Native端的组件，最终实现相应的功能。JS端中所写控件的作用类似 Map中的key 值，对应着Native端的对应控件（如 Android 中 标签对应 ViewGroup 控件）。JS端会通过多个key 组合成Dom，最后交由Native端进行解析，最终渲染出Native端的控件。

JS—Virtual DOM—C++Bridge

flutter//https://juejin.im/post/5dc4012df265da4d500f92a5
高效率：跨平台
高性能：自渲染，有自己的引擎,不靠原生渲染，媲美原生
高一致性：一套代码，在多端表现一致
动态更新

flutter技术架构
DartAPP:Dart Application====Java Application
Dart Framework:Flutter Framework(Dart)====Android Framework(Java)
有android和ios的主体，有很多动画
C++ Engine（Dart VM）
Flutter依靠Flutter Engine虚拟机在iOS和Android上运行
Flutter的2D渲染引擎：Skia
Platform

Flutter引擎层
有四个核心线程
平台线程：对于安卓和 iOS 来说就是常说的主线程
UI线程：面对安卓本身的主线程，就是一个独立的线程
GPU线程：跑在 CPU 上的线程，它做的主要是 Skia 相关工作
IO线程：比如图片解码、编解码，主要做 IO 相关的工作

Flutter编译产物
Dart Code—app.dill—app.apk
最开始 Dart 代码用前端编译器编译，然后是引擎代码通过编译生成apk

线程通讯
Flutter Looper
对于主线程复用了原来的 Native 的
对于另外三个线程创建一个独立的 Looper，不同的是它有两个消息队列，依然是跑消息的方式，通过 Task Runner 就好比安卓的 Handle，通过 PostTask 就好比把一个消息放在一个消息队列里去
不同的是在于我们这里有一个 MessageQueue，这里有两个队列，它怎么处理呢？先处理微型任务，微型任务处理完了再处理普通任务，所以在 Flutter 里叫 Task，在安卓里叫 Message，技术神奇的相似

Dart虚拟机
安卓听到非常多的概念是“进程间通信”，它最终怎么通信？用户态进程不能共享，但是内核态可以共享，这就找到一个可以共享的地方，把通信数据在内核态放进对方的队列里，另外一边就可以拿到了

widget

渲染原理
Widget 树
它是 Element 的配置，如果两个 Widget 之间做了变化它会做差分，比较一下到底哪部分做了变化，只把变化更新到 Element 里去，以最小粒度做更新。到了 Element 里构建渲染过程中会创建 Render 对象，创建渲染的过程。
渲染来了一个信号，UI 线程更新动画，动画完了做一个建立，建立过程中生成 Render，再往下布局、绘制大小等工作。这个完成以后会生成一个 Layer Tree，也跨两个线程，UI 和 GPU 线程。到了 GPU 线程之后会调用 Skia 做渲染

平台的 Channel
Flutter 提供一套 Channel 机制，橙色部分代码，写相应平台安卓或者 iOS 定制代码，中间有一套机制帮你实现封装好，你写 Dart 代码直接可以调到安卓或者 iOS 代码，这个过程是异步的

笔记
google官方实例—万物起源