Is it possible to create separate row header table?

Tags: #<Tag:0x00007f8b1d702bf0>

Hi,

My current scenario is that I’m planning to set rowHeaders to false and create a separate table for the row headers. The reason is that I want to optimize the app. Coz inside the row header is where most of the heavy-lifting is done.

I have a demo here, this is the best I can do for now: https://stackblitz.com/edit/mc-react-hot-optim-trial

I think we can create a separate table, but the problem would be the sync scrolling. If you scroll on the new table of the demo it is scrolling synchronously. But I’m aware that handsontable is not scrolling until the bottom part. And if I scroll inside handsontable, the the other table won’t scroll.

Goal:

  1. Create a separate table for row header.
  2. Make them look as one (achievable through CSS, but not yet implemented in the demo)
  3. Synchronize the scrolling (meaning if user scroll on the handsontable the other table should scroll as well, vice versa)

Is this possible at all? Thank you!

Hey Hugh. I’ve just updated you about the issue with moving columns so I guess that we can focus on this ticket now, as we wait for the v8 release.

That’s an interesting case. I’ excited to check what can we do to optimize the app and at the same time keep both tables working synchronously. I’m having the same issues with StackBlitz, so I cannot run the demo but I can see the code.

I think that the main issue with the scroll might be related to the operations made on a single table. Example: When we change height for a cell we need to do the same for the second table. As the demos are usually the base of the application I would need to ask if you use any of the settings

  • colWidths
  • rowHeights
  • custom renderer
  • custom cell styling