An Ember addon for performant infinite scroll and occlusion culling at high frame rates.
Vertical Collection is an Ember.js addon that provides high-performance infinite scrolling and occlusion culling for web applications. It solves the problem of slow rendering and poor user experience when displaying long lists by only rendering the items currently visible in the viewport, enabling frame rates above 60 FPS.
Ember.js developers building data-intensive applications with long lists, tables, or feeds where rendering performance is critical, such as dashboards, admin panels, or social media feeds.
Developers choose Vertical Collection because it offers a seamless way to integrate performant virtual scrolling into existing Ember apps without major refactoring. Its unique selling point is the "svelte renders" philosophy, which aggressively culls off-screen content to maximize rendering efficiency and maintain smooth scrolling.
Infinite Scroll and Occlusion at > 60FPS
Open-Awesome is built by the community, for the community. Submit a project, suggest an awesome list, or help improve the catalog on GitHub.
Implements occlusion culling to only render visible content, enabling frame rates above 60 FPS for long lists, as emphasized in the 'svelte renders' philosophy to reduce DOM workload.
Augments existing Ember applications without major rewrites, supporting dynamic content sizes and table layouts, as shown in usage examples and demos.
Provides smooth infinite scrolling in both directions, working with scrollable divs and the page body, demonstrated in feature demos for flexible use cases.
Offers actions like firstReached and lastVisibleChanged for precise scroll and visibility management, enhancing user interaction handling in complex lists.
Exclusively designed for Ember.js, making it unsuitable for projects using other JavaScript frameworks or considering migration, limiting its applicability.
Requires careful configuration of settings like estimateHeight and bufferSize, which can be complex and error-prone, especially with dynamic item sizes, as noted in the README examples.
Integration with Ember tests necessitates additional setup, such as registering the ember-raf-scheduler test waiter, adding overhead to the testing process, as mentioned in the Contributing section.