Skip to content

Commit 49de56c

Browse files
authored
perf(tooltip): Defer hooking up events until there's a message and the tooltip is not disabled (#19764)
* perf(tooltip): Defer hooking up events until there's a message and the tooltip is not disabled * comment update
1 parent 223caaa commit 49de56c

File tree

1 file changed

+14
-1
lines changed

1 file changed

+14
-1
lines changed

src/material/tooltip/tooltip.ts

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -144,6 +144,7 @@ export class MatTooltip implements OnDestroy, AfterViewInit {
144144
private _disabled: boolean = false;
145145
private _tooltipClass: string|string[]|Set<string>|{[key: string]: any};
146146
private _scrollStrategy: () => ScrollStrategy;
147+
private _viewInitialized = false;
147148

148149
/** Allows the user to define the position of the tooltip relative to the parent element */
149150
@Input('matTooltipPosition')
@@ -173,6 +174,8 @@ export class MatTooltip implements OnDestroy, AfterViewInit {
173174
// If tooltip is disabled, hide immediately.
174175
if (this._disabled) {
175176
this.hide(0);
177+
} else {
178+
this._setupPointerEvents();
176179
}
177180
}
178181

@@ -202,14 +205,17 @@ export class MatTooltip implements OnDestroy, AfterViewInit {
202205
@Input('matTooltip')
203206
get message() { return this._message; }
204207
set message(value: string) {
205-
this._ariaDescriber.removeDescription(this._elementRef.nativeElement, this._message);
208+
if (this._message) {
209+
this._ariaDescriber.removeDescription(this._elementRef.nativeElement, this._message);
210+
}
206211

207212
// If the message is not a string (e.g. number), convert it to a string and trim it.
208213
this._message = value != null ? `${value}`.trim() : '';
209214

210215
if (!this._message && this._isTooltipVisible()) {
211216
this.hide(0);
212217
} else {
218+
this._setupPointerEvents();
213219
this._updateTooltipMessage();
214220
this._ngZone.runOutsideAngular(() => {
215221
// The `AriaDescriber` has some functionality that avoids adding a description if it's the
@@ -276,6 +282,7 @@ export class MatTooltip implements OnDestroy, AfterViewInit {
276282

277283
ngAfterViewInit() {
278284
// This needs to happen after view init so the initial values for all inputs have been set.
285+
this._viewInitialized = true;
279286
this._setupPointerEvents();
280287

281288
this._focusMonitor.monitor(this._elementRef)
@@ -543,6 +550,12 @@ export class MatTooltip implements OnDestroy, AfterViewInit {
543550

544551
/** Binds the pointer events to the tooltip trigger. */
545552
private _setupPointerEvents() {
553+
// Optimization: Defer hooking up events if there's no message or the tooltip is disabled.
554+
if (this._disabled || !this.message || !this._viewInitialized ||
555+
this._passiveListeners.size) {
556+
return;
557+
}
558+
546559
// The mouse events shouldn't be bound on mobile devices, because they can prevent the
547560
// first tap from firing its click event or can cause the tooltip to open for clicks.
548561
if (!this._platform.IOS && !this._platform.ANDROID) {

0 commit comments

Comments
 (0)