DataGridXL: Excel-like Experience for Web Apps

Demos

Basics

Performance

Import

App Ideas

You're looking at DataGridXL v2. Click here to go to the latest version.

One Million Cells

A

1;1
2;1
3;1
4;1
5;1
6;1
7;1
8;1
9;1
10;1

B

1;2
2;2
3;2
4;2
5;2
6;2
7;2
8;2
9;2
10;2

C

1;3
2;3
3;3
4;3
5;3
6;3
7;3
8;3
9;3
10;3

D

1;4
2;4
3;4
4;4
5;4
6;4
7;4
8;4
9;4
10;4

E

1;5
2;5
3;5
4;5
5;5
6;5
7;5
8;5
9;5
10;5

F

1;6
2;6
3;6
4;6
5;6
6;6
7;6
8;6
9;6
10;6

G

1;7
2;7
3;7
4;7
5;7
6;7
7;7
8;7
9;7
10;7

H

1;8
2;8
3;8
4;8
5;8
6;8
7;8
8;8
9;8
10;8

I

1;9
2;9
3;9
4;9
5;9
6;9
7;9
8;9
9;9
10;9

J

K

L

M

DataGridXL has excellent scroll performance. The grid has its own lightweight virtual DOM implementation. It means that the grid does not actually have a million DOM nodes in memory. Only the columns are DOM nodes.

This approach is radically different from other products out there. Many other products will show you a "speedy" demo with perhaps 1,000 rows. Easy when rows only have a few columns. But DataGridXL is the only product that is perfectly able to keep scrolling smooth with hundreds of columns.

Code

<style>
#grid {
  height: 400px;
  border: 1px solid grey;
}
</style>

<div id="grid"></div>

<script src="https://code.datagridxl.com/datagridxl2.js"></script>
<script>
var grid = new DataGridXL("grid", {
  data: DataGridXL.createDummyData(2000,500)
});
</script>

Demos

Basics

Performance

Import

App Ideas

One Million Cells

Code

Leave email to receive latest updates!

Links

Support

Misc.