The column headers are rendered multiple times during the scroll

Tags: #<Tag:0x00007f4546342230>

Hi, Handsontable Team,

In HT8, Handsontable has done a lot of improvement in the performance which is a major motivation for us to upgrade to the latest version. Thanks for the work.

After upgrading to HT9, when I measure the performance, I notice that the column header seems to be rendered multiple times.


In this example: Column “A” and “B” are the left fixed columns:

When I scroll vertically, in each onTableScroll, there are two major function triggered:

  1. ‘render’ function triggered by ‘renderer/index’. I believe this is for rendering the rows which is the main body of the table.

  2. ‘refresh’ function triggered by ‘overlays’. I think this is for rendering the overlay layer like the left fixed columns and column headers.

In our app, I placed the debugger in the appendColHeader and I noticed that:

  1. This function is triggered by both ‘renderer/index’ and ‘overlays’

I don’t totally understand how Handsontable rendering works. But, if the ‘overlays’ is supposed to render the column headers, why is the renderer/index also renderers them? I don’t see this overlay rendering in version 3.0.0.

This will adds about 20ms in each scroll rendering in our app. I am trying the squeeze the performance for each scroll render. Currently, after upgrade, it increase about 50ms comparing to our previous version 3.0.0

Btw, each column header is a DOM string, not a plain string.

If you think this might be something we did incorrectly in our app, let me know.

Thanks so much.


Thank you for this report. May I also ask you for a demo where this issue can be replicable?
We haven’t been reported any issues regarding performance drop in v9 (besides the use of the new formula engine) reported at

We have our tools that check the performance of a new version upon the release, and we did not see any bugger changes. It means that maybe your implementation settings are outside of the scope of our tests. A demo with your settings would help us a lot to investigate the solve the case.

Thanks for the quick response @aleksandra_budnik

Our table is very customized. So, it is kind of hard to provide a demo where the performance issue could be reproduced.

I think the bottleneck of performance is very much likely to happen on our side. I just want to check with you if above could an issue.

Thanks again.

It might be the cause of Handsontable.
By customized, do you mean that you have a custom method for the scroll even ofafterGetColHeader` method? Because those two seem to be the first thing that came to my mind as the source of possible issues.