Comparing the best Javascript Data Grids
Trying to choose the best data grid for your project is not an easy task. There are dozens, if not hundreds, of products out there, all shouting for your attention and money (yes, that includes us).
Here's a little secret: there is no "The Best Data Grid". It all depends on what you're looking for in a data grid.
Don't blindly choose the product with "the most features"
It's important to have a clear idea of the app you would like to make before choosing a data grid. If you don't have a clear idea, you just might end up picking the product with "the most features". Not always a good idea.
The truth is: there is not a single product out there that can magically "do-it-all". Some try, at the cost of performance and reliability. These products are sometimes as large as 700kb, some even 1MB+, and chock-full of bugs: a real killer for your pageload speeds and advertised user experience.
Different types of data grids
So ask yourself what kind of table your SaaS app or website needs:
- A read-only table for presentation purposes, with pagination and sorting options.
- A read-only data grid that supports high-frequency updates/redraws, for things like Stock or Bitcoin trading.
- A data grid to edit JSON/Javascript data, with user-friendly spreadsheet-like controls.
- A spreadsheet-product, with features like formulas, merged cells, HTML (images) in cells, pivot tables, etc.
When DataGridXL got featured on Hacker News we received a huge amount of positive feedback. At the same time, many folks were wondering: "How is this different/better compared to other data grid products, like ag-Grid, Handsontable, Jexcel...?"
DataGridXL is a spreadsheet-like editor for data sets
DataGridXL is in category 3: it's not a spreadsheet-app, but rather an editor (component) for Javascript/JSON data sets with controls that are familiar to spreadsheet users. An important difference to keep in mind.
On this page we'll be comparing DGXL with four well-known and respected Javascript data table components:
Grids for editing Data
- Handsontable (Categories 3+4)
- Jexcel (Categories 3+4)
Grids for presenting Data
- ag-Grid (Categories 1+2)
- DataTables (Category 1)
What we're looking for in a grid
We're looking for the best product for editing a JSON data set or a Javascript 2D array. We'll be looking at performance specifically: both scroll & edit performance. We'll also be looking at user-friendliness (from an end-user perspective).