From 7e71370fe6a9e802f68f7d3dbbfd0194ecde2d4f Mon Sep 17 00:00:00 2001 From: Kristiyan Kostadinov Date: Sat, 14 Aug 2021 14:03:14 +0200 Subject: [PATCH] perf(platform-browser): avoid intermediate arrays in server transition (#43145) The server transition initializer looks for some `style` tags and clears them based on their `ng-transition` ID. The way we currently have the logic creates a couple of intermediate arrays just so we can call `forEach` at the end. These changes use a regular `for` loop with an `if` statement instead. This isn't a _massive_ performance improvement, but the logic does run during app initialization which is performance-sensitive and it's an easy change to make on our end. PR Close #43145 --- .../platform-browser/src/browser/server-transition.ts | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/packages/platform-browser/src/browser/server-transition.ts b/packages/platform-browser/src/browser/server-transition.ts index 4e476495957..8d064d2e491 100644 --- a/packages/platform-browser/src/browser/server-transition.ts +++ b/packages/platform-browser/src/browser/server-transition.ts @@ -7,7 +7,7 @@ */ import {DOCUMENT, ɵgetDOM as getDOM} from '@angular/common'; -import {APP_INITIALIZER, ApplicationInitStatus, Inject, InjectionToken, Injector, StaticProvider} from '@angular/core'; +import {APP_INITIALIZER, ApplicationInitStatus, InjectionToken, Injector, StaticProvider} from '@angular/core'; /** * An id that identifies a particular application being bootstrapped, that should @@ -21,10 +21,11 @@ export function appInitializerFactory(transitionId: string, document: any, injec // the server. injector.get(ApplicationInitStatus).donePromise.then(() => { const dom = getDOM(); - const styles: any[] = - Array.prototype.slice.apply(document.querySelectorAll(`style[ng-transition]`)); - styles.filter(el => el.getAttribute('ng-transition') === transitionId) - .forEach(el => dom.remove(el)); + const styles: HTMLCollectionOf = + document.querySelectorAll(`style[ng-transition="${transitionId}"]`); + for (let i = 0; i < styles.length; i++) { + dom.remove(styles[i]); + } }); }; }