界面设计服务异常时如何分层降级
复杂背景应该随时能撤下。WebGL 上下文丢失、浏览器不支持或用户开启减少动态效果时，页面要留下清晰的内容和静态视觉，而不是等到动画报错后才处理。
const canvas = document.querySelector('canvas');
canvas.addEventListener('webglcontextlost', (event) => {
event.preventDefault();
document.documentElement.dataset.art = 'static';
stopRenderer();
});
if (matchMedia('(prefers-reduced-motion: reduce)').matches) {
document.documentElement.dataset.art = 'static';
}
帧率采样可用于提示降级，但后台标签页等环境会干扰数值，别仅凭一次采样判断用户设备。降级状态要可测试、可恢复，并释放 Worker、事件监听和渲染资源。最稳妥的保底通常是一张受控的静态图或 CSS 渐变。
