[ZEPPELIN-3251] slow rendering on very wide datasets - display columns only when necessary

• Type: Improvement
• Status: Open
• Priority: Major
• Resolution: Unresolved
• Affects Version/s: 0.8.0, 0.7.4, 0.9.0
• Component/s: front-end
• Assignee: Unassigned
• Reporter: Ruslan Dautkhanov
• Created: 21/Feb/18 06:55
• Updated: 01/May/18 14:28

Description

Apache Zeppelin recently upgraded to angular ui-grid - that looks awesome!

What we're facing though is on wider datasets Chrome sometimes spends minutes to render a table.

The table doesn't have a lot of data (it's very sparsely populated), so it seems just the number of columns is what important.

Maybe more of an extreme case - 5000 columns x 1000 rows recent Chrome spent many minutes to render on a decent PC. That's not a make-up case and we actually had to display such a wide sparsely populated table. (Our company normally deals with wider datasets)

Even on not so wide datasets we found browser rendering could be lagging..

Possible solution: shows rows/columns lazily on scrolling events.

As an example, Cloudera HUE worked around displaying such wide datasets by adding "virtual" horizontal scrolling - basically columns are pushed to an html table only when they have to be visualized (if a user has pushed horizontal scrolling to the right .. and efficiently removing columns from html when they're not necessary for visualization). Cloudera Hue can render such wide datasets very quickly because browser has to render only a tiny subset of columns that it actually needs.

Issue Links

• relates to: ZEPPELIN-2387 [Umbrella] Improve UX
• relates to: ZEPPELIN-2411 Improve Table
• links to: angular-ui/ui-grid/issues/6573
• links to: PR-2323 for ZEPPELIN-2411