# 计划图形上下文消失

> 检测丢失的 WebGL 上下文，将游戏状态与 GPU 对象分开保存，并测试有意的渲染器恢复路径。

- URL: https://oneshotgems.ai/zh-Hans/topics/webgl-context-loss
- 类别: 游戏开发者指南
- 类型: 指南
- 更新日期: 2026年10月5日

当浏览器或系统回收图形资源、驱动程序更改或 GPU 工作停止时，WebGL 上下文可能会丢失。曾经引用纹理、缓冲区和程序的 GPU 句柄在丢失后将不再可以安全使用。强大的游戏会将其游戏的权威状态和玩家状态保留在这些资源之外，因此它可以重建渲染器，而不需要完全重新启动游戏。上下文丢失是一个值得刻意练习的边缘情况，而不是一个未经测试的事件。

## 停止渲染并显示可恢复状态

侦听画布上的 webglcontextlost，当您打算支持恢复时阻止默认行为，并在上下文不可用时停止发出绘制调用。如果恢复可能需要时间，请给玩家一条克制的消息，但保留当前的游戏状态并避免将其视为新关卡或丢失的保存。

保持资源描述（例如源图像、着色器文本和缓冲区数据）独立于 WebGL 句柄可用。恢复时，根据这些描述创建一组新的 GPU 对象，重新连接属性和 uniform 变量，恢复视口和渲染状态，然后仅在正确绘制一个小的已知场景后恢复。

## 模拟真实交互过程中的损失

在开发过程中使用 WEBGL_lose_context 扩展来在场景加载后触发丢失。测试在添加纹理时、玩家移动时以及返回可见选项卡后丢失上下文。确认恢复路径重新创建了每个所需的资源，并且任何挂起的异步负载都被安全地重新应用或丢弃。

MDN 记录丢失事件和测试用扩展程序。在将失败的图形操作解释为普通着色器或资源错误之前，还要检查 isContextLost()。记录开发诊断中发生的情况，以便将恢复错误与正常渲染失败区分开来。

## 常见问题

**上下文恢复可以恢复我的纹理吗？** 不。将新上下文视为需要新的 GPU 资源。保留源数据或重新加载它的方法，然后在恢复上下文时重新创建纹理和其他对象。

**如何在不等待真正失败的情况下测试上下文丢失？** MDN 的 webglcontextlost 文档演示了 WEBGL_lose_context 扩展，它可以故意触发丢失，以便您可以执行恢复路径。

## 跟随好奇心探索

- [追踪浏览器游戏中的内存泄漏](https://oneshotgems.ai/zh-Hans/topics/game-memory-leaks): 使用可重复的游戏和清理检查来查找保留的游戏场景、侦听器、计时器和随时间累积的资产。
- [查找画布渲染瓶颈](https://oneshotgems.ai/zh-Hans/topics/canvas-game-performance): 使用可重复的场景分析 2D Canvas 游戏，测量耗时分布后再减少高成本的绘制工作。

## 延伸阅读

- [MDN：webglcontextlost 事件](https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/webglcontextlost_event)
- [MDN： isContextLost()](https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/isContextLost)

---
规范页面: https://oneshotgems.ai/zh-Hans/topics/webgl-context-loss