perf(cdkTextareaAutosize): Allow custom LineHeight computation strategies

[kseamon]

Is this a regression?

• Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

_cacheTextareaLineHeight() runs at startup for every instance of cdkTextareaAutosize, despite the fact that for most applications, the line height value will be consistent and constant across the whole app, and frequently known at development time.

_cacheTextareaLineHeight() is a costly operation as it triggers css layout (measured at about 20ms per textarea in my app).

For most applications, it would be safe to compute the value only once and share between instances, and many other apps could just hardcode it.

See internal CL 421826236 for more context.

Reproduction

Steps to reproduce:

1. Bootstrap multiple textareas with cdkTextareaAutosize

Expected Behavior

Developer is able to override default behavior of doing costly measurements of text line height on every instance

Actual Behavior

No mechanism to override default behavior of doing costly measurements of text line height on every instance

Environment

• Angular: 13
• CDK/Material: 13
• Browser(s): All
• Operating System (e.g. Windows, macOS, Ubuntu): All

[JamesJansson]

I can confirm that this is an issue with cdkTextareaAutosize which still happens in Angular 15.
In a list of components with textareas using cdkTextareaAutosize, and just 60 items goes from requiring 110ms to draw everything without cdkTextareaAutosize, up to 304ms to draw using cdkTextareaAutosize.

Angular: 15
Angular Material: 15
Browser: Chrome (Ubuntu, Ryzen 3600).

[jmidyet-clickup]

This causes massive performance issue in our application. Any update here? 🙏

[st4s1k]

still a problem in 2025