Performance issue - working

by ilaria_nunziante

HTML

<link rel="stylesheet" href="https://s3.amazonaws.com/flexmonster/2.3/demo.css">
<script src="https://cdn.flexmonster.com/flexmonster.js"></script>

<div id="pivot-container">The component will appear here</div>

JavaScript

let mapping1 = {
	Quantity: {type: "number"},
	Product: {type: "string"},
	Month: {type: "string"},
	Year: {type: "string"}
}
let mapping2 = {
	Quantity: {type: "number"},
	Product: {type: "string"},
	Month: {type: "level", level: "Month", parent: "Year", hierarchy:"Time"},
	Year: {type: "level", level: "Year",  hierarchy:"Time"}
}
var pivot = new Flexmonster({
  container: "pivot-container",
  componentFolder: "https://cdn.flexmonster.com/",
  toolbar: true,
  report: {
    dataSource: {
      data: getData(),
      mapping: mapping1
    },
    options: {
      editing: true
    }
  }
});

function getData() {
  let count = 20000;
  let data = [];
  for (var i=0; i < count; i++){
  	for (var j = 7; j <=12; j++){
      let item ={
        Quantity: 1,
        Product: 'Product ' + i,
        Month: 'Month' + j,
        Year: 2020
      }
      data.push(item);
    }    
  	for (var j = 1; j <=6; j++){
      let item ={
        Quantity: 1,
        Product: 'Product ' + i,
        Month: 'Month' + j,
        Year: 2021
      }
      data.push(item);
    }    
  }
  return data;
}