made with vue.js

Vue Virtual Scroll

Virtual Scrolling Library

Visit Site

Description

Virtual Scrolling Library

"@pdanpdan/virtual-scroll is a Vue 3 library designed to handle massive datasets with ease.

Whether you have thousands or billions of items, it ensures smooth scrolling and minimal memory usage by only rendering what's visible on the screen."

  • Virtualization: We only render the items currently in the viewport (plus a small buffer), keeping the DOM light and the UI responsive.
  • Coordinate Scaling: To bypass browser scroll limits, we use a dual-coordinate system. We can virtually scroll through billions of pixels by scaling internal "Virtual Units" to "Display Units" within the browser's supported range.
  • 1:1 Movement: Unlike many other scaled virtual scroll implementations, we ensure that 1 pixel of movement on the wheel or touch results in exactly 1 pixel of movement in the viewport, maintaining a natural feel regardless of the scale.

Social Media Links

Vue 3 Google Sign-in Google OAuth2 Plugin for Vue
icon-eye-dark Created with Sketch. 3.109
Tinymotion Animation Library
icon-eye-dark Created with Sketch. 3.038
Sentry for Vue Vue Application Monitoring
πŸ’š Sponsored by Friends
We’re hosting on Digital Ocean! πŸ’™ Try it today and get a free $100 credit.
tRPC-Nuxt Build typesafe APIs with Nuxt
icon-eye-dark Created with Sketch. 1.265
Vue.resize Detect HTML Resize Events
icon-eye-dark Created with Sketch. 12.791