Skip to content

Commit 584d528

Browse files
committed
perf(material/tooltip): Defer injection of injectables not needed until tooltip is shown.
1 parent c1ff40f commit 584d528

File tree

1 file changed

+8
-13
lines changed

1 file changed

+8
-13
lines changed

src/material/tooltip/tooltip.ts

Lines changed: 8 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -187,10 +187,7 @@ const MAX_WIDTH = 200;
187187
},
188188
})
189189
export class MatTooltip implements OnDestroy, AfterViewInit {
190-
private _overlay = inject(Overlay);
191190
private _elementRef = inject<ElementRef<HTMLElement>>(ElementRef);
192-
private _scrollDispatcher = inject(ScrollDispatcher);
193-
private _viewContainerRef = inject(ViewContainerRef);
194191
private _ngZone = inject(NgZone);
195192
private _platform = inject(Platform);
196193
private _ariaDescriber = inject(AriaDescriber);
@@ -209,7 +206,6 @@ export class MatTooltip implements OnDestroy, AfterViewInit {
209206
private _positionAtOrigin: boolean = false;
210207
private _disabled: boolean = false;
211208
private _tooltipClass: string | string[] | Set<string> | {[key: string]: any};
212-
private _scrollStrategy = inject(MAT_TOOLTIP_SCROLL_STRATEGY);
213209
private _viewInitialized = false;
214210
private _pointerExitEventsInitialized = false;
215211
private readonly _tooltipComponent = TooltipComponent;
@@ -362,9 +358,6 @@ export class MatTooltip implements OnDestroy, AfterViewInit {
362358
private readonly _passiveListeners: (readonly [string, EventListenerOrEventListenerObject])[] =
363359
[];
364360

365-
/** Reference to the current document. */
366-
private _document = inject(DOCUMENT);
367-
368361
/** Timer started at the last `touchstart` event. */
369362
private _touchstartTimeout: null | ReturnType<typeof setTimeout> = null;
370363

@@ -462,7 +455,7 @@ export class MatTooltip implements OnDestroy, AfterViewInit {
462455
const overlayRef = this._createOverlay(origin);
463456
this._detach();
464457
this._portal =
465-
this._portal || new ComponentPortal(this._tooltipComponent, this._viewContainerRef);
458+
this._portal || new ComponentPortal(this._tooltipComponent, this._injector.get(ViewContainerRef));
466459
const instance = (this._tooltipInstance = overlayRef.attach(this._portal).instance);
467460
instance._triggerElement = this._elementRef.nativeElement;
468461
instance._mouseLeaveHideDelay = this._hideDelay;
@@ -512,12 +505,14 @@ export class MatTooltip implements OnDestroy, AfterViewInit {
512505
this._detach();
513506
}
514507

515-
const scrollableAncestors = this._scrollDispatcher.getAncestorScrollContainers(
508+
const scrollableAncestors = this._injector.get(ScrollDispatcher).getAncestorScrollContainers(
516509
this._elementRef,
517510
);
518511

512+
const overlay = this._injector.get(Overlay);
513+
519514
// Create connected position strategy that listens for scroll events to reposition.
520-
const strategy = this._overlay
515+
const strategy = overlay
521516
.position()
522517
.flexibleConnectedTo(this.positionAtOrigin ? origin || this._elementRef : this._elementRef)
523518
.withTransformOriginOn(`.${this._cssClassPrefix}-tooltip`)
@@ -537,11 +532,11 @@ export class MatTooltip implements OnDestroy, AfterViewInit {
537532
}
538533
});
539534

540-
this._overlayRef = this._overlay.create({
535+
this._overlayRef = overlay.create({
541536
direction: this._dir,
542537
positionStrategy: strategy,
543538
panelClass: `${this._cssClassPrefix}-${PANEL_CLASS}`,
544-
scrollStrategy: this._scrollStrategy(),
539+
scrollStrategy: this._injector.get(MAT_TOOLTIP_SCROLL_STRATEGY)(),
545540
});
546541

547542
this._updatePosition(this._overlayRef);
@@ -874,7 +869,7 @@ export class MatTooltip implements OnDestroy, AfterViewInit {
874869
/** Listener for the `wheel` event on the element. */
875870
private _wheelListener(event: WheelEvent) {
876871
if (this._isTooltipVisible()) {
877-
const elementUnderPointer = this._document.elementFromPoint(event.clientX, event.clientY);
872+
const elementUnderPointer = this._injector.get(DOCUMENT).elementFromPoint(event.clientX, event.clientY);
878873
const element = this._elementRef.nativeElement;
879874

880875
// On non-touch devices we depend on the `mouseleave` event to close the tooltip, but it

0 commit comments

Comments
 (0)