[Select] If have a lot data, open two times

[viniarruda]

• This is not a v0.x issue.
• I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior 🤔

Open the select options normally and don't have a reload because the transition

Current Behavior 😯

If my select have a lot data, while it opens, it recharges 2 times and takes too long to open.
I test in my Iphone and work normally, but in chromee browser crash.

Steps to Reproduce 🕹

Link:

1. https://codesandbox.io/s/hopeful-thompson-pqm0l

Context 🔦

If the data is little, works normally. I think is relationed to screen size

Your Environment 🌎

ts.config test in my application

  "compilerOptions": {
    "baseUrl": ".",
    "outDir": "build/dist",
    "module": "esnext",
    "target": "es5",
    "lib": ["es7", "dom"],
    "sourceMap": true,
    "allowJs": true,
    "jsx": "react",
    "moduleResolution": "node",
    "rootDir": "src",
    "forceConsistentCasingInFileNames": true,
    "noImplicitReturns": true,
    "noImplicitThis": true,
    "noImplicitAny": true,
    "strictNullChecks": false,
    "suppressImplicitAnyIndexErrors": true,
    "noUnusedLocals": true,
    "experimentalDecorators": true,
    "resolveJsonModule": true,
    "skipLibCheck": true,
    "allowSyntheticDefaultImports": true,
    "emitDecoratorMetadata": true,
  },
  "exclude": [
    "node_modules",
    "build",
    "scripts",
    "acceptance-tests",
    "webpack",
    "jest",
    "src/setupTests.ts",
    "mock-server",
    "src/**/*.test.ts"
  ]
}```
<!---
    Include as many relevant details about the environment with which you experienced the bug.
    If you encounter issues with typescript please include version and tsconfig.
-->

| Tech         | Version |
|---------------|------------|
| Material-UI  | v3.9.1  |
| React        |   v16.8.6      |
| Typescript | 3.2.4 |

[eps1lon]

If my select have a lot data, while it opens, it recharges 2 times and takes too long to open.

I would consider the first statement a bug as well but the second one is a common performance issue that should be solved with windowing libraries (also known as virtualization).

[oliviertassinari]

It's the second time I see this issue class. I could have sworn that the first time, it was closed as "won't fix" but I can't find the reference.

The reasoning was the following: "The double animation seemed correlated to the slowness of the component. Even without the double animation, the select is too slow to be usable, so why bother? Use the native select instead".

[viniarruda]

It's the second time I see this issue class. I could have sworn that the first time, it was closed as "won't fix" but I can't find the reference.

The reasoning was the following: "The double animation seemed correlated to the slowness of the component. Even without the double animation, the select is too slow to be usable, so why bother? Use the native select instead".

I not find any issue relationed with this.

For resolve this, I used menuProps: transitionDuration: 0. But the select lose your transition and I could not overwrite it

[eps1lon]

Even without the double animation, the select is too slow to be usable, so why bother?

Because there may be an underlying issue that is only reproducible deterministically with long lists i.e. maybe it also happens on slow devices?

[oliviertassinari]

Yes, we very likely have an underlying issue. But is this an important one? It's an open question. Assuming that only people pushing the component to its limit can see it, I'm tempted to say no. But this assumption could be wrong.

[eps1lon]

Sure so it as an issue. Not an important but unless we know the cause we shouldn't close it as wontfix if we don't even know how a fix would look like.

[viniarruda]

Yes, we very likely have an underlying issue. But is this an important one? It's an open question. Assuming that only people pushing the component to its limit can see it, I'm tempted to say no. But this assumption could be wrong.

But I tested it on my iphone 7 and it worked normally. Definily is strange and an issue.

[joshwooding]

I can't reproduce this with Chrome Version 84.0.4147.105 (Windows 10). @viniarruda are you still experiencing this?

Here's an updated codesandbox: https://codesandbox.io/s/nice-booth-t8u7u?file=/src/index.js

[oliviertassinari]

@joshwooding I have seen this bug happen recently on the date picker, you can have this same issue with a x5 slowdown on the CPU when opening the date picker popup.

I suspect an issue with the double rendering of react-transition-group.