Data Grid Lazy loading

Jspreadsheet Pro implements a smart virtual DOM management that brings a greater performance. In the example below, the spreadsheet handles 2 million cells (200K x 10 columns).

	A	B	C	D	E	F	G	H	I	J
1	A1	B1	C1	D1	E1	F1	G1	H1	I1	J1
2	A2	B2	C2	D2	E2	F2	G2	H2	I2	J2
3	A3	B3	C3	D3	E3	F3	G3	H3	I3	J3
4	A4	B4	C4	D4	E4	F4	G4	H4	I4	J4
5	A5	B5	C5	D5	E5	F5	G5	H5	I5	J5
6	A6	B6	C6	D6	E6	F6	G6	H6	I6	J6
7	A7	B7	C7	D7	E7	F7	G7	H7	I7	J7
8	A8	B8	C8	D8	E8	F8	G8	H8	I8	J8
9	A9	B9	C9	D9	E9	F9	G9	H9	I9	J9
10	A10	B10	C10	D10	E10	F10	G10	H10	I10	J10
11	A11	B11	C11	D11	E11	F11	G11	H11	I11	J11
12	A12	B12	C12	D12	E12	F12	G12	H12	I12	J12
13	A13	B13	C13	D13	E13	F13	G13	H13	I13	J13
14	A14	B14	C14	D14	E14	F14	G14	H14	I14	J14
15	A15	B15	C15	D15	E15	F15	G15	H15	I15	J15
16	A16	B16	C16	D16	E16	F16	G16	H16	I16	J16
17	A17	B17	C17	D17	E17	F17	G17	H17	I17	J17
18	A18	B18	C18	D18	E18	F18	G18	H18	I18	J18
19	A19	B19	C19	D19	E19	F19	G19	H19	I19	J19
20	A20	B20	C20	D20	E20	F20	G20	H20	I20	J20
21	A21	B21	C21	D21	E21	F21	G21	H21	I21	J21
22	A22	B22	C22	D22	E22	F22	G22	H22	I22	J22
23	A23	B23	C23	D23	E23	F23	G23	H23	I23	J23
24	A24	B24	C24	D24	E24	F24	G24	H24	I24	J24
25	A25	B25	C25	D25	E25	F25	G25	H25	I25	J25
26	A26	B26	C26	D26	E26	F26	G26	H26	I26	J26
27	A27	B27	C27	D27	E27	F27	G27	H27	I27	J27
28	A28	B28	C28	D28	E28	F28	G28	H28	I28	J28
29	A29	B29	C29	D29	E29	F29	G29	H29	I29	J29
30	A30	B30	C30	D30	E30	F30	G30	H30	I30	J30
31	A31	B31	C31	D31	E31	F31	G31	H31	I31	J31
32	A32	B32	C32	D32	E32	F32	G32	H32	I32	J32
33	A33	B33	C33	D33	E33	F33	G33	H33	I33	J33
34	A34	B34	C34	D34	E34	F34	G34	H34	I34	J34
35	A35	B35	C35	D35	E35	F35	G35	H35	I35	J35
36	A36	B36	C36	D36	E36	F36	G36	H36	I36	J36
37	A37	B37	C37	D37	E37	F37	G37	H37	I37	J37
38	A38	B38	C38	D38	E38	F38	G38	H38	I38	J38
39	A39	B39	C39	D39	E39	F39	G39	H39	I39	J39
40	A40	B40	C40	D40	E40	F40	G40	H40	I40	J40
41	A41	B41	C41	D41	E41	F41	G41	H41	I41	J41
42	A42	B42	C42	D42	E42	F42	G42	H42	I42	J42
43	A43	B43	C43	D43	E43	F43	G43	H43	I43	J43
44	A44	B44	C44	D44	E44	F44	G44	H44	I44	J44
45	A45	B45	C45	D45	E45	F45	G45	H45	I45	J45
46	A46	B46	C46	D46	E46	F46	G46	H46	I46	J46
47	A47	B47	C47	D47	E47	F47	G47	H47	I47	J47
48	A48	B48	C48	D48	E48	F48	G48	H48	I48	J48
49	A49	B49	C49	D49	E49	F49	G49	H49	I49	J49
50	A50	B50	C50	D50	E50	F50	G50	H50	I50	J50
51	A51	B51	C51	D51	E51	F51	G51	H51	I51	J51
52	A52	B52	C52	D52	E52	F52	G52	H52	I52	J52
53	A53	B53	C53	D53	E53	F53	G53	H53	I53	J53
54	A54	B54	C54	D54	E54	F54	G54	H54	I54	J54
55	A55	B55	C55	D55	E55	F55	G55	H55	I55	J55
56	A56	B56	C56	D56	E56	F56	G56	H56	I56	J56
57	A57	B57	C57	D57	E57	F57	G57	H57	I57	J57
58	A58	B58	C58	D58	E58	F58	G58	H58	I58	J58
59	A59	B59	C59	D59	E59	F59	G59	H59	I59	J59
60	A60	B60	C60	D60	E60	F60	G60	H60	I60	J60
61	A61	B61	C61	D61	E61	F61	G61	H61	I61	J61
62	A62	B62	C62	D62	E62	F62	G62	H62	I62	J62
63	A63	B63	C63	D63	E63	F63	G63	H63	I63	J63
64	A64	B64	C64	D64	E64	F64	G64	H64	I64	J64
65	A65	B65	C65	D65	E65	F65	G65	H65	I65	J65
66	A66	B66	C66	D66	E66	F66	G66	H66	I66	J66
67	A67	B67	C67	D67	E67	F67	G67	H67	I67	J67
68	A68	B68	C68	D68	E68	F68	G68	H68	I68	J68
69	A69	B69	C69	D69	E69	F69	G69	H69	I69	J69
70	A70	B70	C70	D70	E70	F70	G70	H70	I70	J70
71	A71	B71	C71	D71	E71	F71	G71	H71	I71	J71
72	A72	B72	C72	D72	E72	F72	G72	H72	I72	J72
73	A73	B73	C73	D73	E73	F73	G73	H73	I73	J73
74	A74	B74	C74	D74	E74	F74	G74	H74	I74	J74
75	A75	B75	C75	D75	E75	F75	G75	H75	I75	J75
76	A76	B76	C76	D76	E76	F76	G76	H76	I76	J76
77	A77	B77	C77	D77	E77	F77	G77	H77	I77	J77
78	A78	B78	C78	D78	E78	F78	G78	H78	I78	J78
79	A79	B79	C79	D79	E79	F79	G79	H79	I79	J79
80	A80	B80	C80	D80	E80	F80	G80	H80	I80	J80
81	A81	B81	C81	D81	E81	F81	G81	H81	I81	J81
82	A82	B82	C82	D82	E82	F82	G82	H82	I82	J82
83	A83	B83	C83	D83	E83	F83	G83	H83	I83	J83
84	A84	B84	C84	D84	E84	F84	G84	H84	I84	J84
85	A85	B85	C85	D85	E85	F85	G85	H85	I85	J85
86	A86	B86	C86	D86	E86	F86	G86	H86	I86	J86
87	A87	B87	C87	D87	E87	F87	G87	H87	I87	J87
88	A88	B88	C88	D88	E88	F88	G88	H88	I88	J88
89	A89	B89	C89	D89	E89	F89	G89	H89	I89	J89
90	A90	B90	C90	D90	E90	F90	G90	H90	I90	J90
91	A91	B91	C91	D91	E91	F91	G91	H91	I91	J91
92	A92	B92	C92	D92	E92	F92	G92	H92	I92	J92
93	A93	B93	C93	D93	E93	F93	G93	H93	I93	J93
94	A94	B94	C94	D94	E94	F94	G94	H94	I94	J94
95	A95	B95	C95	D95	E95	F95	G95	H95	I95	J95
96	A96	B96	C96	D96	E96	F96	G96	H96	I96	J96
97	A97	B97	C97	D97	E97	F97	G97	H97	I97	J97
98	A98	B98	C98	D98	E98	F98	G98	H98	I98	J98
99	A99	B99	C99	D99	E99	F99	G99	H99	I99	J99
100	A100	B100	C100	D100	E100	F100	G100	H100	I100	J100

<html>
<script src="https://jspreadsheet.com/v7/jspreadsheet.js"></script>
<link rel="stylesheet" href="https://jspreadsheet.com/v7/jspreadsheet.css" type="text/css" />
<script src="https://jsuites.net/v5/jsuites.js"></script>
<link rel="stylesheet" href="https://jsuites.net/v5/jsuites.css" type="text/css" />

<div id="spreadsheet"></div>

<script>
let data = [];

for (let j = 0; j < 500000; j++) {
    data[j] = [];
    for (let i = 0; i < 10; i++) {
        data[j][i] = jspreadsheet.helpers.getColumnNameFromCoords(i, j);
    }
}

jspreadsheet(document.getElementById('spreadsheet'), {
    data: data,
    tableOverflow: true,
    lazyLoading: true,
    lazyColumns: true,
    onlazyloading: function(el, addedRows, removedRows) {
        // Related events
    },
    license: 'ODhhZDA3MjQyYWM5NWQwYTFlZTNkNjA0NzY3ODFmMDFlYzcyYWQ0Y2FjZGQ3MDdhMGE2N2RkOThkYTRhOTAzYTY5ODYyMzM1Y2NlMTc3NWE5YTE4YTBiYzUyYzY3Njc4OTQ4ZDg3NmVkODJlZjAyOWI1MTRmOTRlMGI2YmJhNzYsZXlKamJHbGxiblJKWkNJNklpSXNJbTVoYldVaU9pSktjM0J5WldGa2MyaGxaWFFpTENKa1lYUmxJam94TnpRME9EWXlOekUzTENKa2IyMWhhVzRpT2xzaWFuTndjbVZoWkhOb1pXVjBMbU52YlNJc0ltTnZaR1Z6WVc1a1ltOTRMbWx2SWl3aWFuTm9aV3hzTG01bGRDSXNJbU56WWk1aGNIQWlMQ0ozWldJaUxDSnNiMk5oYkdodmMzUWlYU3dpY0d4aGJpSTZJak0wSWl3aWMyTnZjR1VpT2xzaWRqY2lMQ0oyT0NJc0luWTVJaXdpZGpFd0lpd2lkakV4SWl3aVkyaGhjblJ6SWl3aVptOXliWE1pTENKbWIzSnRkV3hoSWl3aWNHRnljMlZ5SWl3aWNtVnVaR1Z5SWl3aVkyOXRiV1Z1ZEhNaUxDSnBiWEJ2Y25SbGNpSXNJbUpoY2lJc0luWmhiR2xrWVhScGIyNXpJaXdpYzJWaGNtTm9JaXdpY0hKcGJuUWlMQ0p6YUdWbGRITWlMQ0pqYkdsbGJuUWlMQ0p6WlhKMlpYSWlMQ0p6YUdGd1pYTWlYU3dpWkdWdGJ5STZkSEoxWlgwPQ=='
});
</script>
</html>

Edit this page on GitHub