vue-virtual-scroller VS fullPage

I'll debug this further to confirm, the problem could be rendering that amount of data instead of actually filtering them. I'm using vuejs2, when the user type something I emit an event which in turn will call a computed property that will get trigged to start the filtering then pass that filtered data to a component library as a prop called DynamicScroller which is supposedly described as "Blazing fast scrolling for any amount of data"

To fix this, we can opt for using a Virtual Scroller (luckly for us there is one for Vue 3.0) this will keep our page for rendering so many HTML tags and it will create a smooth and clean experience for our users.

It is a solution name. You can find libraries. https://github.com/Akryum/vue-virtual-scroller

These popular components allow for quick scrolling through large amounts of data in Vue apps, but do come with a caveat; Vue-virtual-scroller and Vue-virtual-scroll-list don’t deal with dynamic heights unless you hardcode them. If you want to test it out, there is a playground available for Vue Virtual Scroller here.

30 mins, i have been trying to find a virtual scroller library that supports variable height per item with support for transitions ,this one doesnt support transitions https://github.com/Akryum/vue-virtual-scroller and has no tests, for the last 6 months

Website: https://akryum.github.io/vue-virtual-scroller/#/ GitHub: https://github.com/Akryum/vue-virtual-scroller GitHub Stars: 3.4k

From what I can tell they're using fullpage.js: https://alvarotrigo.com/fullPage/ But, as mentioned CSS scrollsnap is also an option to explore.

Have you check fullPage.js?

https://alvarotrigo.com/fullPage/ I think you need this

It’s a nuxt app (vue) using full page JS

Close to that. At least Tesla's website is using the css scroll snap behaviour. Closer to what I mean would be the FullPage.js library.

Fullpag.js is what you're looking for.