HTML本身不支持WeakRef，它是JavaScript的ES2021特性，仅在JS运行时生效；写在HTML标签属性中仅为字符串，无任何语义或行为影响，弱引用逻辑必须在JS代码中显式实现。
HTML 本身不支持 WeakRef，也不存在“HTML 实现 WeakRef 缓存”这回事。WeakRef 是 JavaScript 的原生 API（ES2021），只在 JS 运行时生效；你在 <script> 里用它才有效，写在 HTML 标签属性（如 class="weakref"、data-ref="xxx"）里纯属字符串，浏览器解析器完全无视，更不会触发任何弱引用行为。
WeakRef 必须在 JS 中显式创建和使用
WeakRef 的作用是让 JS 代码持有对象但不阻止 GC 回收——这个逻辑只能由 JS 引擎执行，HTML 解析器连 WeakRef 这个词都不认识。常见误用包括：
- 把
new WeakRef(el)存进全局变量或闭包，却还在事件监听器里直接用el—— 闭包捕获的el是强引用，WeakRef 完全没用 - 用
WeakRef包裹HTMLImageElement后，没处理onerror：加载失败的图片不会被 GC，WeakRef 永远不“失效”，缓存条目卡死 - 对
NodeList或HTMLCollection调用new WeakRef(nodes)—— 报错，因为它们不是单个可弱引用对象
WeakRef 单独用会积累无效引用，必须配 FinalizationRegistry
只靠 WeakRef.deref() 轮询检查，无法及时清理缓存键。典型陷阱是：
Article To Html
下载
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
-
cache.set(key, new WeakRef(obj))后，obj 被 GC 回收，cache里仍存着这个 WeakRef 实例，cache.size不变，查找变慢 -
FinalizationRegistry回调中传入的heldValue用了对象（如{ key }），导致该对象因被 registry 持有而无法回收 —— 必须用string或symbol - 注册时漏传
unregisterToken（即 WeakRef 实例本身），后续无法精准注销，同一 key 可能被重复清理或根本不清
图像/Canvas 等资源需额外处理边界情况
DOM 元素类资源有特殊生命周期，WeakRef 不能自动覆盖：
立即学习“前端免费学习笔记（深入）”；
-
HTMLImageElement加载失败（onerror触发）时，对象仍存在但无内容，WeakRef 不会 deref() 为undefined，必须手动cache.delete(key) -
ImageBitmap在部分浏览器（如旧版 Safari）不支持直接registry.register()，需先包装成普通对象：const wrapper = { bitmap }; registry.register(wrapper, key, ref); -
OffscreenCanvas的transferToImageBitmap()返回的ImageBitmap同样受上述限制，不能直接当 WeakRef 目标注册
真正容易被忽略的是：WeakRef 和 FinalizationRegistry 都不控制对象是否该被回收，只响应“已被回收”。如果你在别处还存着那个 DOM 元素的强引用（比如一个未清除的 setTimeout 回调里用了它），它就永远不会被 GC，registry 回调也永远不会触发——所有弱引用机制都建立在这个前提之上。
