与其他浏览器相比，IE11 渲染/加载图标较晚答案

【问题标题】：IE11 rendering /loading icons late as compared to other browser与其他浏览器相比，IE11 渲染/加载图标较晚
【发布时间】：2018-12-07 09:07:17
【问题描述】：

我正在使用 Angular 5 应用程序并在整个站点中使用 SVG 图标。在 Chrome、Mozilla 和 Safari 等普通浏览器中，图标可以正常加载，但在 IE11 中则不能。

为此，我在 pollyfill.ts 文件中添加了 svgxuse。 https://github.com/Keyamoon/svgxuse

在此更改之后，所有图标现在都可以在 IE11 浏览器中加载，但加载时间很晚。我的意思是在屏幕上加载所有内容后大约需要 1-2 秒。

从用户的角度来看，这并不好。有谁知道如何在 IE 浏览器中预加载/快速加载这些图标。

提前致谢。

【问题讨论】：

请不要打扰，如果仍然使用 5 年前发布的浏览器并且几乎从未更新，则必须付出代价。
这是给客户的。他们只使用 IE11、Edge 和 Safari 11 作为他们的主要浏览器。
好吧，在第一次加载之后，在查看 git 示例时，我在 IE11 中看不到比在其他浏览器中更明显的延迟。如果我是你，我真的不会打扰，赢得一秒与几天的工作不值得。

标签： javascript angular svg icons

【解决方案1】：

我认为你不能做这么多......也许可以尝试服务工作者（我不知道他们是否在 IE11 中工作）......使用Service worker 你可以加载和缓存图像和资产......

类似：（在您的 ngsw-config.js 文件中）

{
  "index": "/index.html",
  "assetGroups": [{
    "name": "app",
    "installMode": "prefetch",
    "resources": {
      "files": [
        "/favicon.ico",
        "/index.html"
      ],
      "versionedFiles": [
        "/*.bundle.css",
        "/*.bundle.js",
        "/*.chunk.js"
      ]
    }
  }, {
    "name": "assets",
    "installMode": "lazy",
    "updateMode": "prefetch",
    "resources": {
      "files": [
        "/assets/**"
      ]
    }
  }]
}

然后在您的 angular.cli.json 文件集中：

"serviceWorker": true

希望对你有帮助！

【讨论】：

让我试试。 :) 谢谢
希望对您有所帮助..但要小心 IE 11 已经很老了，所以请使用 service worker 对其进行全面测试.. 尝试 Prefetch 模式