[bug]: slect lags when use many options

shadcn-ui / ui

Beautifully designed components that you can copy and paste into your apps. Accessible. Customizable. Open Source.

https://ui.shadcn.com

MIT License

65.26k stars 3.75k forks source link

[bug]: slect lags when use many options #3788

Open Chetan-KK opened 2 months ago

Chetan-KK commented 2 months ago

Describe the bug

i've used next js 13 and fetched google fonts from api and used select, application starts lagging as soon as select is opend

Affected component/components

selec

How to reproduce

get google fonts from api
and use in select

Codesandbox/StackBlitz link

No response

Logs

No response

System Info

chrome browser

Before submitting

[X] I've made research efforts and searched the documentation
[X] I've searched for existing issues

nguyentan2808 commented 2 months ago

This is not library bug, just a common problem when you deal with render largest list in a website. Try to integration with a library like react-window to reduce number of html tag rendered, shadcn-ui is fully support for integration with that libraries.

beanznotavailable commented 2 months ago

@Chetan-KK use something like Shadcn Virtualized Combobox to render large list in a virtualized manner, so that your select component doesn't lag