#18834 铬: {#if}/snippet-only 片段中的响应式 <img> 永远保留 — 模板文档克隆被采用到页面文档的 comment() 片段中并返回 · svelte

描述错误

在Chrimium中,每个客户端提供的"<img srcset"尺寸(或用"<source srcset"来表示),其组件被挂在一个只锚的片段内——一个"{#if}"/"{:else}"分支或片段,其机体只是一个组件,"<svelte:bondary>"待定/外屏内容被保留了****,与整个被拆卸的子树一起被永久地保留. 在SvelteKit的电子商务应用上,这个被封住的DOM节点每个访问的产品页,直到标签OOM'd。

保留者是本地人:Chrimium在文件的“MediaQueryMatcher”中登记了拥有的“HTMLimage Element:ViewportCchangeListener”(强大的“Member<HTMLimageElement ”),用于每个视港图像。 Svelte的碎片组装在** 二份文件** 到达页面前反弹出一棵树, Chromium 最终在 QQtemplate 内容文档的匹配器中注册,

取自 html'的克隆人标出自template>.content' 与node.cloneNode(real)' (src/internal/client/dom/template.js:78',非Firefox路径) – 克隆人为惰性模板内容文件T所拥有。属性效应设置为 “ src/ srcset/ sizers” ; Chromium 的“ Select SourL ” 对不活动文档的早期返回 —— 尚未收听。
本部分附在其锚前。仅锚放于文件.创建文件碎片'——评论()',attemplate.js:342',borary.js:266/317'——即页文件M.通过T-M-HTMLimage Element:DiveToNewDocument'-SelectSourL'-在M's配对器中创建和注册的听众。
M碎片被附在母体尚未连接的T克隆中。 Chromium 的 “ removed from” unregisters M, 然后是 “ inserted Into” , 如果( listener ) GetDocument () 的话。 Get MediaQueryMatcher (. ). Add Viewport listener( listener )" 没有活动文档检查 – 注册于 **T's ** matcher.
母树进入一页:根收录T-M再收录M. 没有未注册的T。
卸载 -- -- 仅 " 从 " 未登记M。 T由M拥有,用于页面的寿命('Document::template document- '),因此T's配对者保留了收听者-`-(上方指向)被移除的整个子树.

这也是Chromium bug (Did MoveToNewDocument'应取消旧文档的登记;与下面的plain-DOM repro单独报告),但Svelte是我所知在组装过程中采用子树M-T-M的唯一框架:模板克隆来自T,而comment ()'/边界碎片来自M. Firefox(`importNode'路径);Chromium 151.0.7922.34复制(也是报告用户的Chrome版本)。

** 建议的修补:** 在最后插入之前,将所有东西都保留在一个文档中——从模板文档中创建出“评论()'和边界”外屏碎片(例如复制一个被缓存的QQtemplate--content s碎片),因此子树在真正插入时被精确通过一次;或使用“文件”。无条件导入节点(现有) . . . . . . .