iOS 页面组件计数分析 M1 视图树 · M2 堆普查 · M5 组件内存 · 交叉验证

节点详情

点击左侧任意节点查看详情

弧长权重：当前「节点数」

环 = 层级深度（内→外）· 弧长 = 所选度量的子树规模 · 颜色 = 来源（■系统 ■应用私有 ■三方库 ■独立图层，越深越暗）· 对象内存 = class_ro_t.instance_size 设备实测（view+layer 真实壳）· 背衬估算 = contents 实测位图优先（bilibili 66 层）+ 自绘类启发式（容器类无 backing）· 悬停看子树规模，点击查节点详情

节点详情

点击旭日图任意环段

读图要点

· 一整圈就是一个 window 的渲染树，从根（中心）到叶子；
· 厚弧大段 = 该分支子树庞大（如 bilibili 的 feed 卡片区）；
· 细碎密齿 = 大量同类兄弟组件（如 CAShapeLayer 装饰层）；
· 颜色随深度变暗，可快速目测「系统壳有多厚、业务层埋多深」；
· 中心数字 = 全树节点总数。
拖拽平移 · 滚轮缩放（以光标为焦点）· 点击节点折叠/展开（火焰图点击缩放）

树上组件 · 按类计数

全部 系统 UIKit 应用私有 三方库

堆普查 · 存活实例类直方图

通道 C（uicount 全 malloc 区扫描）· 与左图同页面对照：树=在屏，堆=存活

类分布矩形树图

面积 = 所选度量 · 颜色 = 来源 · Top 60 类（悬停看计数与内存）

树深度分布

来源构成

树上节点按实现来源分类

视图背衬图层（view → backing layer）

每个 UIView 子类实例由哪个 CALayer 子类承载渲染

独立图层节点（sublayer，不在 view 树）

recursiveDescription 下钻 layer.sublayers 的产物（iOS 13+）· 渲染树的一部分

视图 ↔ 图层 汇总

malloc 分区分布（对象在哪个区）

通道 C 按 VM tag 扫描 · tag10=medium 区是 UIView 子类主居所（>255B）
布局 × 热力 · 按真实 frame 定位

悬停查看详情

微信登录页 vs bilibili 首页 · 指标对照

同设备同协议（静息态、挂起瞬间双通道）· 条形为等比缩放

数值表

M1/M2 比值解读：M1（树）= 此刻渲染什么；M2（堆）= 此刻存活什么。 bilibili 首页 0.90 —— 树与堆基本一致，按需创建、用完即弃； 微信登录页 0.14 —— 444 个存活 view 仅 63 个上树，其余为预构建缓存（WCRedesign* 表单组件、MMUIButton 等），激进预构建风格的实证。 该比值本身即页面实现风格指标，可直接用于跨框架（如 ArkUI）对比。