javascript - 数百万行的JavaScript数据网格[关闭](JavaScript data grid for millions of rows [closed])

Question

I need to present a large number of rows of data (ie. millions of rows) to the user in a grid using JavaScript.

(我需要使用JavaScript在网格中向用户呈现大量数据行（即数百万行）。)

The user shouldn't see pages or view only finite amounts of data at a time.

(用户不应一次看到页面或仅查看有限数量的数据。)

Rather, it should appear that all of the data are available.

(相反，应该看起来所有数据都可用。)

Instead of downloading the data all at once, small chunks are downloaded as the user comes to them (ie. by scrolling through the grid).

(并非一次下载所有数据，而是在用户访问它们时下载小块（即，通过滚动网格）。)

The rows will not be edited through this front end, so read-only grids are acceptable.

(这些行将不会通过此前端进行编辑，因此可接受只读网格。)

What data grids, written in JavaScript, exist for this kind of seamless paging?

(对于这种无缝分页，存在哪些用JavaScript编写的数据网格？)

  ask by Rudiger translate from so

Answer 1

( Disclaimer: I am the author of SlickGrid )

(（ 免责声明：我是SlickGrid的作者 ）)

UPDATE This has now been implemented in SlickGrid .

(更新现在已在SlickGrid中实现。)

Please see http://github.com/mleibman/SlickGrid/issues#issue/22 for an ongoing discussion on making SlickGrid work with larger numbers of rows.

(请参阅http://github.com/mleibman/SlickGrid/issues#issue/22 ，以获取有关使SlickGrid处理更多行的正在进行的讨论。)

The problem is that SlickGrid does not virtualize the scrollbar itself - the scrollable area's height is set to the total height of all the rows.

(问题是SlickGrid不会虚拟化滚动条本身-可滚动区域的高度设置为所有行的总高度。)

The rows are still being added and removed as the user is scrolling, but the scrolling itself is done by the browser.

(用户滚动时，行仍在添加和删除，但是滚动本身是由浏览器完成的。)

That allows it to be very fast yet smooth (onscroll events are notoriously slow).

(这使得它可以非常快速而流畅（众所周知，滚动事件很慢）。)

The caveat is that there are bugs/limits in the browsers' CSS engines that limit the potential height of an element.

(需要注意的是，浏览器的CSS引擎中存在一些错误/限制，这些错误/限制限制了元素的潜在高度。)

For IE, that happens to be 0x123456 or 1193046 pixels.

(对于IE，恰好是0x123456或1193046像素。)

For other browsers it is higher.

(对于其他浏览器，它更高。)

There is an experimental workaround in the "largenum-fix" branch that raises that limit significantly by populating the scrollable area with "pages" set to 1M pixels height and then using relative positioning within those pages.

(在“大号固定”分支中有一个实验性的解决方法，它通过使用“页面”设置为1M像素高度填充可滚动区域，然后在这些页面中使用相对定位，来显着提高该限制。)

Since the height limit in the CSS engine seems to be different and significantly lower than in the actual layout engine, this gives us a much higher upper limit.

(由于CSS引擎中的高度限制似乎有所不同，并且明显低于实际布局引擎中的高度限制，因此这给了我们更高的上限。)

I am still looking for a way to get to unlimited number of rows without giving up the performance edge that SlickGrid currently holds over other implementations.

(我仍在寻找一种方法，以达到无限制的行数而又不放弃SlickGrid当前在其他实现上所拥有的性能优势。)

Rudiger, can you elaborate on how you solved this?

(Rudiger，能否详细说明如何解决此问题？)