Flutter 渲染原理详解
Flutter 最大的特点是自己掌管每一个像素——它不依赖平台原生控件，而是用 Skia（现为 Impeller）直接在 Canvas 上绘制 UI。理解它的渲染原理，是写出高性能 Flutter 应用的基础。
第一层：三棵树（Three Trees）
Flutter 渲染的核心是三棵并行的树：Widget 树、Element 树、RenderObject 树。
- Widget 树：你写的代码，纯粹的配置描述，不可变（immutable），频繁重建开销极低
- Element 树：Widget 的实例化，负责协调新旧 Widget 的差异（diff），是真正的"生命周期持有者"
- RenderObject 树：真正负责布局（layout）和绘制（paint）的对象，开销大，尽量复用---
第二层：渲染流水线（Rendering Pipeline）
每一帧，Flutter 都要经历一条精确的流水线。理解这条流水线，你就知道该在哪里优化性能。---
第三层：Layout 的约束传递机制
Flutter 布局有一句口诀："约束向下传，尺寸向上报，父定子位置"（Constraints go down, Sizes go up, Parent sets position）。---
第四层：Paint 与 RepaintBoundary
绘制阶段，Flutter 不会立即"画"到屏幕，而是先录制一份 DisplayList（绘制命令列表），再交给 GPU 线程执行。RepaintBoundary 是开发者手动告诉 Flutter "这个子树是独立图层，父脏了别来打扰它"的关键工具。---
第五层：双线程模型（UI Thread + GPU Thread）
Flutter 天生双线程：UI 线程做逻辑和布局，GPU 线程做合成和光栅化，两者并行流水线作业，互不阻塞。