Description
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
With MatTab tab switching, there exists a delay on mobile devices and in the Chrome mobile emulation dev mode. This is 100% reproducible on the standard documentation page: https://material.angular.dev/components/tabs/overview
Users found that our WebApp has a sluggish delay when switching between MatTabs and I thought there was some issue with the way we load our components, but no: It turns out there is an underlying issue with how Mat Tabs are. Demonstrated in this video, there is a delay.
2025-07-03.19-17-16.mp4
On chrome, until the tab starts to animate, it takes ~100ms from the moment of click. But in Mobile Device Emulation mode, you can see that it takes 3 times as long, roughly ~330ms. This is a bit worse on real iPad hardware, where it take up to ~400ms, feeling seriously sluggish.
I think this to be a regression, related to https://stackoverflow.com/questions/39902055/web-app-feels-less-responsive-when-added-to-iphones-home-screen
Reproduction
StackBlitz link:
Steps to reproduce:
1.
2.
Expected Behavior
The delay when interacting with Mat Tabs should be the same when using touch, as when using the mouse.
Actual Behavior
There seems to be a 300ms delay, specifically with MatTabs
Environment
- Angular: 19
- CDK/Material: 19
- Browser(s): Chrome, Safari
- Operating System (e.g. Windows, macOS, Ubuntu): Windows, iPad OS