WeakRef 实现高效 WebGL 纹理缓存管理

本文深入剖析了WeakRef在WebGL纹理管理中的常见误解与实际局限：WeakRef无法影响GPU内存回收，对WebGLTexture等底层资源句柄完全无效，其deref()永远返回原对象；真正释放纹理必须严格依赖手动解绑（如解除framebuffer绑定）和显式调用gl.deleteTexture()，同时及时清除JS层强引用；WeakRef唯一可行的价值在于安全关联轻量级元数据（如尺寸、格式），且需依附于可被GC的JS宿主对象——想实现高效、可控的“用完即丢”，靠的不是弱引用魔法，而是精准的生命周期控制与严谨的销毁流程。

WeakRef 本身不能让 WebGL 纹理“用完即丢”，它只对 JS 层对象有效；真正释放纹理必须调用 gl.deleteTexture() 并解除所有强引用——WeakRef 只能帮你安全地关联和追踪，不能替代手动销毁。

WeakRef 对 WebGL 纹理对象根本不起作用

WebGL 纹理（如 gl.createTexture() 返回值）是平台对象，其生命周期由 GPU 上下文控制，JS 引擎无法通过 WeakRef 影响它的 GC 行为。即使你用 new WeakRef(texture) 包裹它，只要 texture 还在 JS 作用域里被任何变量持有，它就不会被 GC；而即使 GC 清理了 JS 层包装，GPU 内存仍牢牢占着，直到你显式调用 gl.deleteTexture()。

• WeakRef 只能包裹可被 JS 垃圾回收的普通对象（如 plain object、class 实例），不能包裹 WebGLTexture、ArrayBuffer、CanvasRenderingContext2D 等底层资源句柄
• 浏览器规范明确将 WebGL 对象列为“不可弱引用类型”，WeakRef 构造时不会报错，但 deref() 永远返回原对象（即等价于强引用）
• 试图靠轮询 wr.deref() === undefined 判断纹理是否释放，结果永远是 true —— 它从不变成 undefined

真正可控的“用完即丢”只能靠手动解绑 + 显式销毁

大型纹理（比如 4096×4096 RGBA）单张就占约 64MB GPU 内存，不主动清理，几帧就爆。所谓“用完即丢”，核心是两个动作：及时切断 JS 引用 + 立即调用销毁 API。

• 创建后立刻保存纹理 ID 或标记（如 const textureId = Date.now()），避免直接把 texture 传进闭包或塞进全局数组
• 使用完毕后立即将 JS 变量设为 null：texture = null，帮助 GC 回收 JS 层 wrapper（虽不影响 GPU，但能减少堆压力）
• 必须成对调用：gl.deleteTexture(texture) 是唯一释放 GPU 内存的操作，且需确保上下文仍有效（gl.isContextLost() === false）
• 若纹理绑定在 framebuffer 中，需先解绑：gl.bindFramebuffer(gl.FRAMEBUFFER, null)，否则 deleteTexture 无效

WeakRef 能帮上的唯一场景：缓存纹理元数据而非纹理本身

你可以用 WeakRef 安全地缓存与纹理关联的轻量级 JS 数据（比如尺寸、格式、加载时间戳），前提是这些数据依附于一个可被 GC 的宿主对象（如 DOM 元素、React 组件实例），而不是纹理本身。

• 例如：用 WeakMap 关联 元素和它的纹理配置：textureCache.set(canvasEl, { width: 4096, format: 'RGBA' })，当 canvas 被移除 DOM，WeakMap 自动丢弃该条目
• 若坚持用 WeakRef，可包装一个纯 JS 的纹理描述对象：const desc = { id: 123, size: [4096, 4096] }; const wr = new WeakRef(desc)，但注意：这和 GPU 纹理释放完全无关
• FinalizationRegistry 注册时传入的 holdings 必须是简单值（如 { textureId: 123 }），回调中仅能打日志或上报，不能执行 gl.deleteTexture()（回调中无 gl 上下文）

最容易被忽略的一点：你在调用 gl.deleteTexture(texture) 后，如果还保留着对 texture 的 JS 引用（哪怕只是 console.log 过它），DevTools 的作用域面板就会让它持续驻留——这不是内存泄漏，但会干扰你对真实释放状态的判断。

以上就是本文的全部内容了，是否有顺利帮助你解决问题？若是能给你带来学习上的帮助，请大家多多支持golang学习网！更多关于文章的相关知识，也可关注golang学习网公众号。