IE11 + Angular 1.5.11上的怪异渲染行为

时间:2018-11-19 14:12:35

标签: angularjs internet-explorer-11

我们当前正在开发Angular版本1.5.11中的应用程序。现在它已经变得非常大(数百个控制器等),我们偶然发现了Internet Explorer 11中的一个问题:

一段时间(有时是几分钟,有时是几个小时)之后,页面开始出现毛刺-字母逐渐褪色/消失/改变颜色。它还会影响在同一窗口中打开的其他选项卡(Excel Online的屏幕截图具有相同的问题)。另外,控制台中没有错误。

有人遇到类似问题吗?另外,由于客户的要求,“仅使用普通浏览器”也不可行。

重新启动浏览器会有所帮助,但这比实际的解决方案更能解决问题。


“应用程序”选项卡(它也显示在页面的每个元素上,以提高可见性): Application

在同一浏览器上的“ Excel Online”选项卡: Excel tab on the same browser

2 个答案:

答案 0 :(得分:1)

我怀疑此问题可能与浏览器内存泄漏有关(考虑到其他选项卡也受到影响)。

我们仅在具有Angular 1.3的IE浏览器中遇到内存泄漏问题(不是确切问题)。

尽管此link可以帮助您进行进一步的研究,但我将提及我如何使用IE的内存分析工具来帮助自己。 可以在IE 11开发选项卡中找到此内存分析工具。

  1. 点击开始分析。
  2. 不对应用程序执行任何操作即可获取Web应用程序的堆快照。
  3. 执行一些操作,然后再次拍摄堆快照。
  4. 返回主页,查看分配给您的某些内存是否已释放。

每个堆快照还可以更深入地了解分配的对象以及每个对象消耗的内存。

我附上快照以供参考。

enter image description here

答案 1 :(得分:0)

我的Angular 7应用程序也遇到了同样的问题,并且已经研究了3天。我检查了是否有内存泄漏或不必要的循环。好吧,我没有找到导致此问题的任何特定方法。 我已经在不同的环境中测试了我的应用程序。这仅在我配置较低的计算机上发生。通过挖掘一些解决方案,我发现了这一点:

这可能是由于使用GPU渲染而不是软件渲染来查看网页的缘故。我们需要做的就是更改设置中的配置。请按照以下步骤操作:

  1. 启动Internet Explorer 11。
  2. 单击右上角的“工具”图标,然后单击“ Internet选项”。 (Alt + X)。
  3. 单击“高级”选项卡,然后浏览到“加速图形”部分。
  4. 选中“使用软件渲染代替GPU渲染”复选框。
  5. 单击“应用”,然后单击“确定”。
  6. 关闭所有打开的Internet Explorer 11窗口,然后重新启动Internet Explorer 11。
  7. 在Internet Explorer 11中查看网页。

enter image description here

注意您还可以通过将视频卡升级到支持GPU硬件加速的视频卡来解决此问题。