Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Performance Issue with react-select Rendering Large Datasets #5841

Open
tfmukles opened this issue Jan 9, 2024 · 5 comments
Open

Performance Issue with react-select Rendering Large Datasets #5841

tfmukles opened this issue Jan 9, 2024 · 5 comments
Labels
issue/bug-unconfirmed Issues that describe a bug that hasn't been confirmed by a maintainer yet

Comments

@tfmukles
Copy link

tfmukles commented Jan 9, 2024

Description:
I am experiencing significant performance issues with react-select when rendering a large dataset. The component becomes slow and unresponsive, making it challenging to use in my application.

Steps to Reproduce:

  1. Provide a clear and concise set of steps to reproduce the performance problem.
  2. Include any relevant code snippets or a link to a minimal reproduction repository.

Expected Behavior:
Describe what you expect to happen in terms of performance when using react-select with a large dataset.

@tfmukles tfmukles added the issue/bug-unconfirmed Issues that describe a bug that hasn't been confirmed by a maintainer yet label Jan 9, 2024
@vinuganesan
Copy link

I'm also facing the same performance issue. @tfmukles Have you find any other solution?

Thanks!

@SebastianNarvaez11
Copy link

same error

@pinkpigeonltd
Copy link

I am dealing with a dataset of 20k+ entries. Component is unfortunately not usable in that state.

@highflying
Copy link

I have the same issue, with 8291 options it is slow to filter and update the options in the dropdown menu. It looks like it isn't using a virtualised component so it is rendering all the options, which will 100% cause performance issues.

@Tirzono
Copy link
Contributor

Tirzono commented Mar 12, 2024

We recently migrated from v3 to v5 and were using windowed list (similar to react-windowed-select). We noticed a massive slowdown when we upgraded. With v3 it was usable and nearly instant, with v5 it can take a couple of seconds to open the list. I am talking about 10k entries roughly.

Codesandbox to reproduce the issue here:

https://codesandbox.io/p/sandbox/admiring-firefly-48gfl4

Codesandbox with v3 here (from #5255):

https://codesandbox.io/s/react-select-large-list-ug2f2

Note that the slowness is more apparent in older browsers. For example, in Edge version 119 it's much faster than in Edge version 103.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
issue/bug-unconfirmed Issues that describe a bug that hasn't been confirmed by a maintainer yet
Projects
None yet
Development

No branches or pull requests

6 participants