re: 3 Ways to Render Large Lists in Angular VIEW POST

re: One other way: Don't render 1000 items. Render only first 100 and add a load more button. If the user wants to load more then they need to click o...

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.

Code of Conduct Report abuse