jonasgeiler / svelte-tiny-virtual-list

📚 A tiny but mighty list virtualization library for Svelte, with zero dependencies 💪 Supports variable heights/widths, sticky items, scrolling to index, and more!
https://svelte-tiny-virtual-list.jonasgeiler.com
MIT License
460 stars 24 forks source link

Tiny virtual grid? #8

Open janosh opened 3 years ago

janosh commented 3 years ago

Nice work! Any plans to implement svelte-tiny-virtual-grid or perhaps advice on how to go about that?

jonasgeiler commented 3 years ago

Alright. This answer is a bit late, but I finally got the motivation to revisit my older projects.

The thing is... If you'd ask me how this library works, I wouldn't really know 😅 Most of the code is just taken from react-tiny-virtual-list and I've just made it compatible with Svelte. So maybe perhabs one day, I'll rewrite this whole thing using my own code. But for now I don't have any plans for such a library. Sorry...

mskocik commented 3 years ago

@janosh I would say the virtual grid would use the same principles of what should be displayed at the moment, but in general it's something completely different than simple list. As @Skayo said, it would be totally new library.

Amerlander commented 3 years ago

You could do something like suggested in https://github.com/sveltejs/svelte-virtual-list/issues/16#issuecomment-903715845

Here is a working example for skyao/svelte-tiny-virtual-list: https://svelte.dev/repl/2250c4b4e7054b01ac9329f827bee090?version=3.44.0

bbigras commented 2 years ago

Here is a working example for skyao/svelte-tiny-virtual-list: https://svelte.dev/repl/2250c4b4e7054b01ac9329f827bee090?version=3.44.0

Would this work with a horizontal scroll bar too?

Amerlander commented 2 years ago

It should not matter in what direction you scroll. The Idea is to create a div containing one full Row/Column and the virtual list treats each column/row as a single item.