angular / angular/components

mat-select seems to have serious performance issue

Open
#7,623 25 comments 32 reactions 0 assignees View on GitHub
area: material/select P3 perf
Dominant language
TypeScript
Stars
25k
Forks
6.8k
Avg merge
1d 8h
Merged PRs (30d)
91

Description

#### Bug, feature request, or proposal:
With latest release, mat-form-field support was added for mat-select. But it introduced performance issues when we have multiple select lists (5-8).

When we use mat-form-field with input or text area it doesn't seem to cause any performance issue but it seem that its implementation for mat-select needs a review. On lengthy forms we are seeing a delay of up to 3 seconds, which are instant without mat-form-field on mat-select.

#### What is the expected behavior?
It should smooth and fast.

#### What is the current behavior?
Its very slow.

#### Which versions of Angular, Material, OS, TypeScript, browsers are affected?
Angular 4.4.4
Material 2.0.0-beta.12
Chrome

Contributor guide

Open the contributing guide

Research direction

The report names mat-select and mat-form-field but no files, tests, or reproduction entry point. Start by reproducing the reported delay with 5–8 mat-select controls under Angular 4.4.4 and Material 2.0.0-beta.12, then compare it with mat-select without mat-form-field. Done means the lengthy form no longer shows the reported multi-second delay and the behavior is covered by a regression test or benchmark.

Written by the indexing model from the issue text.

Assessment

Tech stack
angular, typescript
Domain
frontend, performance
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.