我有一个svg sprites文件icons.svg，如下所示：
<?xml version="1.0" encoding="utf-8" ?>
<svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
<symbol id="twitter" viewBox="0 0 512 512">
<path d="..some path data here..."></path>
</symbol>
<symbol id="facebook" viewBox="0 0 512 512">
<path d="..some path data here..."></path>
</symbol>
</svg>
我从网页正文引用的内容：
<svg>
<use xlink:href="/images/common/icons.svg#twitter"></use>
</svg>
我想预加载icons.svg以避免闪烁。怎么做？
我试图将rel rel预加载添加到head：
<head>
<link rel="preload" href="/images/common/icons.svg" as="image" type="image/svg+xml"/>
</head>
但是它不起作用。我在Chrome开发人员工具上看到icons.svg加载了两次，并显示以下警告：
资源http://localhost:57143/images/common/icons.svg原为使用链接预加载进行预加载，但在几秒钟内未使用窗口的加载事件。请确保其具有适当的
as值，并有意预加载]
。
如果您不立即使用prefetch，可以尝试使用它吗？它仍然会被加载。
<link rel="prefetch" href="/images/common/icons.svg" as="image" type="image/svg+xml"/>
由于已作为图像预加载，因此使用<img>标签可以禁止显示此警告。在某处使用此svg添加不可见图像应该可以工作：
<img src="/images/common/icons.svg" style="display: none">