UI Consultant, Maker & Technical Writer.
I write about JS, TS, Rx, Angular & all things Front End
🇮🇹🇬🇧
Follow me on Twitter: https://twitter.com/gc_psk
Founder of https://makerkit.dev
Pagination or your solution are definitely other viable ways - but present the same usability limitations as virtual scrolling.
In my case, this was not an option: I have to render thousands of fonts within a dropdown. No other solution has a "click here to load more fonts" button - so I'd be at a disadvantage. This would definitely be a UX limitation for my users.
At the end of the day:
do you need to display everything? The solutions above may work
do you not? Great! Pagination and Load More could definitely be a solution too
You can replace the load more button with a Visibility trigger or a component that calls a callback when the element is in view port, Then, you will trigger a load more action automatically.
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Pagination or your solution are definitely other viable ways - but present the same usability limitations as virtual scrolling.
In my case, this was not an option: I have to render thousands of fonts within a dropdown. No other solution has a "click here to load more fonts" button - so I'd be at a disadvantage. This would definitely be a UX limitation for my users.
At the end of the day:
You can replace the load more button with a Visibility trigger or a component that calls a callback when the element is in view port, Then, you will trigger a load more action automatically.