如何在Safari开发者工具中调试Page内存增长问题？

关键判断点 #

JS堆稳定但Page内存暴涨，说明泄漏不在JS引擎管控的内存里，大概率是WebView渲染层、Unity交互的原生对象，或是未释放的DOM/资源导致的。

Safari工具的具体排查方法 #

1. Page内存快照对比 #

• 打开Memory标签，选Page类型（别选JS Heap），拍摄初始快照。
• 重复操作触发内存增长，再拍摄2-3次快照。
• 切换到对比模式（比如Compare to Previous），重点关注新增对象：
  • 盯紧DOM Node、Image、Canvas、Native Object这些类型，尤其是数量持续疯涨的条目。
  • 检查是否存在脱离DOM树但被原生代码持有的DOM元素——这类元素JS拿不到引用，但WebView不会自动回收。

2. 内存分配时间线追踪（替代JS分配时间线） #

• 切换到Timelines标签，勾选Memory选项，点击录制按钮开始记录。
• 运行泄漏场景一段时间后停止录制。
• 观察内存曲线的上升节点，对应时间点排查：
  • 是否频繁创建Canvas纹理、加载图片但未释放资源？
  • Unity与WebView的交互中，原生回调是否持有WebView对象引用未释放？
• 点击时间线上的内存峰值，查看该时刻的内存详情，定位新增对象类型。

3. 检查Unity与WebView的交互泄漏 #

• 如果使用了双向通信（比如SendMessage或自定义桥接逻辑），确认：
  • 原生侧是否持续持有JS对象引用未释放？
  • JS侧是否重复注册事件监听器但未移除？比如Unity的回调被多次绑定。

4. 渲染资源排查 #

• 打开Resources标签，查看Images、Fonts、Media的加载情况：
  • 是否存在大量未被回收的图片资源？比如动态创建的img元素未设置为null，Canvas清理后未释放上下文？
  • 检查WebView缓存设置，是否开启了不必要的持久化缓存导致资源堆积。

额外注意 #

• 别忘了排查Unity侧：是否频繁创建WebView实例但未销毁，或是共享的WebView对象被重复注入资源？
• 可以尝试禁用部分Web内容（比如暂停动画、关闭媒体播放），逐步缩小泄漏范围。

内容的提问来源于stack exchange，提问作者kat