带有<use>和load-flash的外部SVG-文件是否异步加载？

Question

我遇到了一个令人烦恼的问题，其中svg图标在较慢设备上的其他内容之后明显加载（未缓存时）。这将导致“缺少/没有图标的闪烁”。

.svg图标被合并到一个外部svg子画面中，并通过以下方式获取：

<svg class="icon icon-microsoftexcel">
    <use href="/icons/symbol-defs.svg#icon-example" xlink:href="/icons/symbol-defs.svg#icon-example"></use>
</svg>

尽管svg / use位于body标记之后，但文件本身几乎总是作为最后一个文件加载。例如，它是在 加载了某个页面中的所有图像之后加载的-并且这些图像在DOM树的下方被称为

。

所以我的问题是：为什么在DOM树中找到请求后就不立即加载文件，还有什么可以加快它的速度吗？

关于速度：
我使用

找到了一些建议

.body::before{
content: url("/icons/symbol-defs.svg");
display:none;
}

但是，这会导致浏览器（chrome）将.svg文件加载两次而不是一次-尝试使用background-image“预加载”文件时也是如此。