调试iOS Safari反复崩溃问题：“A problem repeatedly occurred”

核心排查点 #

• WebKit移动端专属bug：iPhone Safari基于WebKit，滚动触发的逻辑（如懒加载、滚动监听、CSS动画）容易触发移动端特有的渲染或进程异常
• 内存资源过载：iPhone内存阈值远低于桌面端，滚动时频繁执行的DOM操作、未回收的事件监听可能导致进程崩溃
• Safari安全机制误判：跨域资源、跟踪防护或广告拦截规则可能误触发页面进程异常

具体排查步骤 #

1. 抓取iPhone本地系统日志
   • 打开iPhone「设置」→「Safari浏览器」→「高级」，开启「Web检查器」和「JavaScript控制台」
   • 让出现问题的用户提前打开控制台，触发报错后导出日志（通过Mac端Safari连接设备同步日志，前端控制台无输出时，系统级日志可能有崩溃线索）
2. 隔离滚动相关代码
   • 临时移除所有滚动监听（scroll/touchmove/wheel）、懒加载逻辑、滚动触发的CSS动画，逐步恢复代码定位触发点
   • 重点排查requestAnimationFrame配合滚动的代码，WebKit在高频触发时易出现进程异常
3. 监控内存占用
   • 用Mac端Safari开发者工具「内存」面板连接iPhone，模拟滚动操作，实时查看内存变化，排查未释放的DOM节点、全局变量引用等内存泄漏点
4. 排查CSS兼容性问题
   • 检查是否滥用移动端Safari存在bug的CSS特性：
     • 避免滚动容器同时使用overflow: scroll和position: sticky
     • 减少backdrop-filter、will-change的无差别使用，这类属性易导致渲染进程崩溃
5. 锁定iOS版本范围
   • 收集报错用户的iOS版本，问题可能仅存在于特定版本（如iOS 15.x/16.x的WebKit已知bug），针对性做版本兼容测试

临时修复措施 #

• 给滚动容器添加-webkit-overflow-scrolling: touch，强制启用Safari原生滚动优化，减少自定义逻辑冲突
• 用防抖（debounce）函数限制滚动监听的触发频率，降低高频操作对进程的压力
• 给懒加载、动态资源添加加载失败降级逻辑，避免资源加载异常引发进程崩溃

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