时间戳

首页 > 解决方案 > Angular App 在 Edge 和 Firefox 中冻结

angular - Angular App 在 Edge 和 Firefox 中冻结

问题描述

我最近一直在研究一个角度应用程序。它适用于我在手机和电脑上都能找到的所有浏览器，除了 Edge 和 Firefox。Edge 和 Firefox 都冻结，没有任何输出到控制台。一段时间后，Firefox 告诉我该页面已冻结，并为我提供了终止脚本的选项。然后将以下内容打印到控制台：

Error: Script terminated by timeout at:
__spread@http://localhost:4200/vendor.js:86417:14
debugCheckNoChangesNode@http://localhost:4200/vendor.js:49939:38
debugCheckRenderNodeFn@http://localhost:4200/vendor.js:49893:13
View_HeaderComponent_7/<@ng:///AppModule/HeaderComponent.ngfactory.js:187:5
debugUpdateRenderer@http://localhost:4200/vendor.js:49882:12
checkNoChangesView@http://localhost:4200/vendor.js:49237:5
callViewAction@http://localhost:4200/vendor.js:49474:21
execEmbeddedViewsAction@http://localhost:4200/vendor.js:49457:17
checkNoChangesView@http://localhost:4200/vendor.js:49236:5
callViewAction@http://localhost:4200/vendor.js:49474:21
execComponentViewsAction@http://localhost:4200/vendor.js:49436:13
checkNoChangesView@http://localhost:4200/vendor.js:49238:5
callViewAction@http://localhost:4200/vendor.js:49474:21
execComponentViewsAction@http://localhost:4200/vendor.js:49436:13
checkNoChangesView@http://localhost:4200/vendor.js:49238:5
callWithDebugContext@http://localhost:4200/vendor.js:50146:22
debugCheckNoChangesView@http://localhost:4200/vendor.js:49827:12
./node_modules/@angular/core/fesm5/core.js/ViewRef_.prototype.checkNoChanges@http://localhost:4200/vendor.js:47648:55
./node_modules/@angular/core/fesm5/core.js/ApplicationRef.prototype.tick/<@http://localhost:4200/vendor.js:43378:62
./node_modules/@angular/core/fesm5/core.js/ApplicationRef.prototype.tick@http://localhost:4200/vendor.js:43378:17
next/<@http://localhost:4200/vendor.js:43268:99
./node_modules/zone.js/dist/zone.js/</ZoneDelegate.prototype.invoke@http://localhost:4200/polyfills.js:7433:17
onInvoke@http://localhost:4200/vendor.js:42619:24
./node_modules/zone.js/dist/zone.js/</ZoneDelegate.prototype.invoke@http://localhost:4200/polyfills.js:7432:17
./node_modules/zone.js/dist/zone.js/</Zone.prototype.run@http://localhost:4200/polyfills.js:7183:24
./node_modules/@angular/core/fesm5/core.js/NgZone.prototype.run@http://localhost:4200/vendor.js:42533:16
next@http://localhost:4200/vendor.js:43268:69
./node_modules/@angular/core/fesm5/core.js/EventEmitter.prototype.subscribe/schedulerFn<@http://localhost:4200/vendor.js:42350:36
./node_modules/rxjs/_esm5/internal/Subscriber.js/SafeSubscriber.prototype.__tryOrUnsub@http://localhost:4200/vendor.js:69383:13
./node_modules/rxjs/_esm5/internal/Subscriber.js/SafeSubscriber.prototype.next@http://localhost:4200/vendor.js:69321:17
./node_modules/rxjs/_esm5/internal/Subscriber.js/Subscriber.prototype._next@http://localhost:4200/vendor.js:69254:9
./node_modules/rxjs/_esm5/internal/Subscriber.js/Subscriber.prototype.next@http://localhost:4200/vendor.js:69229:13
./node_modules/rxjs/_esm5/internal/Subject.js/Subject.prototype.next@http://localhost:4200/vendor.js:68994:17
./node_modules/@angular/core/fesm5/core.js/EventEmitter.prototype.emit@http://localhost:4200/vendor.js:42334:54
checkStable@http://localhost:4200/vendor.js:42588:13
onLeave@http://localhost:4200/vendor.js:42655:5
onInvoke@http://localhost:4200/vendor.js:42622:17
./node_modules/zone.js/dist/zone.js/</ZoneDelegate.prototype.invoke@http://localhost:4200/polyfills.js:7432:17
./node_modules/zone.js/dist/zone.js/</Zone.prototype.runGuarded@http://localhost:4200/polyfills.js:7196:28
./node_modules/zone.js/dist/zone.js/</Zone.prototype.wrap/<@http://localhost:4200/polyfills.js:7174:24

我包含了所有的 polyfill。

关键是它适用于所有浏览器，包括 IE 而不是 Firefox 和 Edge。这让我想知道出了什么问题。该应用程序非常大，因此不能将其包括在内或将其剥离。

有任何想法吗？

标签： angularfirefoxrxjsmicrosoft-edgezone.js

解决方案

经过大量调试，我终于找到了为什么它会冻结。我正在使用 MutationObserver api，结果证明是冻结的原因。

推荐阅读