Handsontable example

HTML

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/handsontable.full.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/handsontable.full.css">
<div id="example1" class="hot handsontable htRowHeaders htColumnHeaders"></div>
<button class='load'>load data</button>

JavaScript

var example1 = document.getElementById('example1');
  var hot = new Handsontable(example1, {
    data: Handsontable.helper.createSpreadsheetData(200, 20),
    colHeaders: true,
    afterScrollVertically: function(){
    	functionLogDebounced()
    },
    rowHeaders: true,
  	columnSummary: [
      {
        destinationRow: 0,
        reversedRowCoords: true,
        destinationColumn: 0,
        type: 'sum',
        forceNumeric: true
      }
    ]
  });
  
 document.querySelector('.load').addEventListener('click', function(){
 	hot.loadData([[1,1,1,1],[1,1,1,1],[null]])
 })
 
 var functionLog = function() {
 	console.log('aaa')
 }
 
var functionLogDebounced = Handsontable.helper.debounce(functionLog, 500);
//var functionLogThrottled = Handsontable.helper.throttle(functionLog, 500);

functionLogDebounced()