CSS @import 引入外部字体引发SVG文本尺寸计算竞态问题的解决方案咨询

我遇到了这么一个棘手的问题：

• 我需要动态往DOM中添加各类SVG元素
• 其中针对SVGTextElement，我依赖它的getBBox()方法获取文本边界框，以此来确定元素的布局位置
• 同时我是通过CSS的@import语句引入的外部字体

现在的核心问题是：外部字体的下载完成时间晚于页面初始加载完成时间，导致SVG文本元素的边界框计算结果完全错误。

我试过在HTML里监听load和DOMContentLoaded事件来延迟执行布局代码，但这两个事件似乎都不包含@import引入的CSS及关联字体资源的加载完成时机。

我做了一个能稳定复现问题的示例：首次打开示例的新窗口时，显示的边界框数据是错误的——这应该是因为测量时目标字体还未加载完成，用了 fallback 字体的尺寸，但最终应该匹配我引入的外部字体；而如果刷新页面，就能显示正确的数值了。

我也考虑过把字体文件下载下来本地托管，但还是希望能找到不用这么做的更优雅解决方案。

有没有什么技巧能确保@import语句关联的资源（尤其是字体）完全加载完成后，再执行我的布局代码呢？

备注：内容来源于stack exchange，提问作者Jason Polites