From 7b8f625e3a1c0662d409eef230e654701a76f4cc Mon Sep 17 00:00:00 2001 From: Adam Plumer Date: Mon, 11 Jun 2018 00:14:16 -0400 Subject: [PATCH 1/2] perf: remove duplicate function calls --- src/lib/flex/flex-align/flex-align.ts | 1 - src/lib/flex/flex-order/flex-order.ts | 1 - src/lib/flex/flex/flex.ts | 1 - src/lib/flex/layout-align/layout-align.ts | 1 - src/lib/flex/layout/layout.ts | 10 ++-------- 5 files changed, 2 insertions(+), 12 deletions(-) diff --git a/src/lib/flex/flex-align/flex-align.ts b/src/lib/flex/flex-align/flex-align.ts index 6300c19bb..748c04419 100644 --- a/src/lib/flex/flex-align/flex-align.ts +++ b/src/lib/flex/flex-align/flex-align.ts @@ -81,7 +81,6 @@ export class FlexAlignDirective extends BaseDirective implements OnInit, OnChang this._listenForMediaQueryChanges('align', 'stretch', (changes: MediaChange) => { this._updateWithValue(changes.value); }); - this._updateWithValue(); } // ********************************************* diff --git a/src/lib/flex/flex-order/flex-order.ts b/src/lib/flex/flex-order/flex-order.ts index 54509c618..65acc52f5 100644 --- a/src/lib/flex/flex-order/flex-order.ts +++ b/src/lib/flex/flex-order/flex-order.ts @@ -78,7 +78,6 @@ export class FlexOrderDirective extends BaseDirective implements OnInit, OnChang this._listenForMediaQueryChanges('order', '0', (changes: MediaChange) => { this._updateWithValue(changes.value); }); - this._updateWithValue(); } // ********************************************* diff --git a/src/lib/flex/flex/flex.ts b/src/lib/flex/flex/flex.ts index 52e160500..14b732fe3 100644 --- a/src/lib/flex/flex/flex.ts +++ b/src/lib/flex/flex/flex.ts @@ -116,7 +116,6 @@ export class FlexDirective extends BaseDirective implements OnInit, OnChanges, O this._listenForMediaQueryChanges('flex', '', (changes: MediaChange) => { this._updateStyle(changes.value); }); - this._updateStyle(); if (this._container) { // If this flex item is inside of a flex container marked with diff --git a/src/lib/flex/layout-align/layout-align.ts b/src/lib/flex/layout-align/layout-align.ts index 08720db3f..8a79bcd8f 100644 --- a/src/lib/flex/layout-align/layout-align.ts +++ b/src/lib/flex/layout-align/layout-align.ts @@ -94,7 +94,6 @@ export class LayoutAlignDirective extends BaseDirective implements OnInit, OnCha this._listenForMediaQueryChanges('align', 'start stretch', (changes: MediaChange) => { this._updateWithValue(changes.value); }); - this._updateWithValue(); } ngOnDestroy() { diff --git a/src/lib/flex/layout/layout.ts b/src/lib/flex/layout/layout.ts index 50df899ab..cf87e53e4 100644 --- a/src/lib/flex/layout/layout.ts +++ b/src/lib/flex/layout/layout.ts @@ -68,11 +68,8 @@ export class LayoutDirective extends BaseDirective implements OnInit, OnChanges, @Input('fxLayout.lt-md') set layoutLtMd(val) { this._cacheInput('layoutLtMd', val); }; @Input('fxLayout.lt-lg') set layoutLtLg(val) { this._cacheInput('layoutLtLg', val); }; @Input('fxLayout.lt-xl') set layoutLtXl(val) { this._cacheInput('layoutLtXl', val); }; - /* tslint:enable */ - /** - * - */ + constructor(monitor: MediaMonitor, elRef: ElementRef, styleUtils: StyleUtils) { @@ -106,16 +103,13 @@ export class LayoutDirective extends BaseDirective implements OnInit, OnChanges, this._listenForMediaQueryChanges('layout', 'row', (changes: MediaChange) => { this._updateWithDirection(changes.value); }); - this._updateWithDirection(); } // ********************************************* // Protected methods // ********************************************* - /** - * Validate the direction value and then update the host's inline flexbox styles - */ + /** Validate the direction value and then update the host's inline flexbox styles */ protected _updateWithDirection(value?: string) { value = value || this._queryInput('layout') || 'row'; if (this._mqActivation) { From 917db4e08466d391aba62f000e92118260e69f0e Mon Sep 17 00:00:00 2001 From: Adam Plumer Date: Mon, 18 Jun 2018 14:05:37 -0400 Subject: [PATCH 2/2] perf: remove getDisplayStyle call from base ngOnInit --- src/lib/core/base/base.ts | 4 ---- src/lib/extended/show-hide/show-hide.ts | 9 +++++---- 2 files changed, 5 insertions(+), 8 deletions(-) diff --git a/src/lib/core/base/base.ts b/src/lib/core/base/base.ts index 32877dd5a..e83b6923e 100644 --- a/src/lib/core/base/base.ts +++ b/src/lib/core/base/base.ts @@ -80,7 +80,6 @@ export abstract class BaseDirective implements OnDestroy, OnChanges { * querying such as computed Display style */ ngOnInit() { - this._display = this._getDisplayStyle(); this._hasInitialized = true; } @@ -227,9 +226,6 @@ export abstract class BaseDirective implements OnDestroy, OnChanges { return this._hasInitialized; } - /** Original dom Elements CSS display style */ - protected _display; - /** MediaQuery Activation Tracker */ protected _mqActivation: ResponsiveActivation; diff --git a/src/lib/extended/show-hide/show-hide.ts b/src/lib/extended/show-hide/show-hide.ts index d1be0423d..2a6a67009 100644 --- a/src/lib/extended/show-hide/show-hide.ts +++ b/src/lib/extended/show-hide/show-hide.ts @@ -67,6 +67,9 @@ export class ShowHideDirective extends BaseDirective implements OnInit, OnChange */ protected _layoutWatcher: Subscription; + /** Original dom Elements CSS display style */ + protected _display: string; + /* tslint:disable */ @Input('fxShow') set show(val) { this._cacheInput('show', val); } @Input('fxShow.xs') set showXs(val) {this._cacheInput('showXs', val);} @@ -101,11 +104,8 @@ export class ShowHideDirective extends BaseDirective implements OnInit, OnChange @Input('fxHide.gt-sm') set hideGtSm(val) {this._cacheInput('showGtSm', negativeOf(val)); }; @Input('fxHide.gt-md') set hideGtMd(val) {this._cacheInput('showGtMd', negativeOf(val)); }; @Input('fxHide.gt-lg') set hideGtLg(val) {this._cacheInput('showGtLg', negativeOf(val)); }; - /* tslint:enable */ - /** - * - */ + constructor(monitor: MediaMonitor, @Optional() @Self() protected layout: LayoutDirective, protected elRef: ElementRef, @@ -155,6 +155,7 @@ export class ShowHideDirective extends BaseDirective implements OnInit, OnChange */ ngOnInit() { super.ngOnInit(); + this._display = this._getDisplayStyle(); let value = this._getDefaultVal('show', true); // Build _mqActivation controller