本文旨在记录分析Flutter的渲染原理和设计理念，参考了一些文档和博客，方便Flutter开发者学习交流。

页面监控需要尽可能多地收集数据，这样才有可能还原出当时用户操作的真实场景。

还原用户场景常见的有几种方法：逐帧截屏、记录DOM元素及其变化、录制视频。

目前主流的用户行为监控方案都是用的记录DOM元素变化，主要优点是对用户基本上无感知，并且生成的数据量相比另外几种偏小，对性能的影响也不大。本篇我们就来深入分析下clarity在这块做了什么。

上一篇我们大概介绍了clarity各个模块的作用，本篇我想着重来了解下clarity在数据存储、日志上报、性能优化方面做的事情，并试着理清clarity整个的架构。

前端监控一直是前端不可或缺的一部分，这里我调研了微软的clarity，它们主要是针对用户的行为监控进行录制回放，并且能生成热力图分析。为了彻底搞清楚其中的原理，对clarity-js进行了源码分析。

话不多说，直接开始！

本篇不定时更新git实践技巧，方便查阅git命令。