zenn · 游戏开发社区· 来源· Wa-rp Studio·· 2 小时前AI 评分7
用 Playwright 追踪 CSS box-shadow 动画导致浏览器每秒重绘60次的问题
CSS の box-shadow アニメーションが、止まっている画面を毎秒60回描き直していた――トレースで原因を絞る
AI 导读
某卡牌游戏因使用 box-shadow 的 @keyframes 动画，在静止状态下仍触发每秒60次的页面重绘。通过 Playwright 抓取 Chrome 追踪数据定位到该性能瓶颈后，将战斗画面中不可见的阴影移除，并将地图光效改为仅改变 opacity。修复后静止状态重绘次数降为0，鼠标操作时的 RasterTask 耗时从9.8秒降至4.6秒。
来源：zenn · 游戏开发社区 · zenn.dev