Rendering large datasets in Vue.js

• Clusterize.js

  0 7,179 0.0 JavaScript

  Tiny vanilla JS plugin to display large data sets easily

  The difference in performance after adding this plugin is remarkable. However, if you need to be sure, there’s a compelling example at the top of their website that allows you to easily compare a regular table to a Clusterize.js-optimized table. Make sure you check out their playground, too, for even more proof.

• vue-virtual-scroller

  1 9,028 4.1 Vue

  ⚡️ Blazing fast scrolling for any amount of data

  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.

• SurveyJS

  surveyjs.io

  sponsored

  Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

  

• vue-virtual-scroll-list

  1 4,262 3.8 JavaScript

  ⚡️A vue component support big amount data list with high render performance and efficient.

  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.

• vue-collection-cluster

  0 33 0.0 Vue

  Discontinued Vue component for displaying large data sets easily with great performance.

  

  Another option is the Vue-collection-cluster component, which allows you to calculate heights dynamically, but it lags miserably at about 50,000 items.

Suggest a related project