tabris.cloud

Tabris

Blog

WebPet 重构记录:让桌宠只加载一次

记录 WebPet 从页面效果变成稳定 runtime 的重构边界。

先划清所有权

这次重构的重点不是继续调动作,而是先确认 React mount 和 WebPet runtime 的边界。React 负责挂载、样式和一次性启动,runtime 负责 position、dock、peek 和 restore。

如果同一帧里有多个 owner 写 transform、right、bottom 或 CSS variables,桌宠就会在导航和主题切换时跳位。因此调试信息也要围绕 owner 设计。

导航事件不要打断动作

导航事件只在 WebPet ready 且 hatch 完成后派发,并用 pathname 和 href 去重。这样可以避免重复触发 reveal 或 dock transition。

后续继续修 WebPet 时,优先补 debug trace,而不是先调动作参数。

Related Posts