TypeScript/NG2 - Performance issues

I’ve been conducting some performance analysis on the DHTMLX grid with the following metrics:
2080 rows, 50 columns, and custom visualizations with 24 data points.
This is being done with pagination limit of 10 rows. SmartRendering is enabled.

The results were great when using only JavaScript and HTML. Rendering times are calculated from the moment the first cell is rendered until the last cell is rendered. Here are the results:
1 table - 76 MS
10 tables - 770 MS

When using DHTMLX without Angular 2, the performance behaves in a linear fashion. In other words, the additional time to render each table is consistent with the amount of time it took to render the first table.

Now with Angular 2, it does not behave in this fashion and the performance drops off significantly:
1 table = 103 MS
10 tables = 4799 MS

If anyone could provide me with suggestions as to how I could improve the performance of the rendering times, it would be much appreciated!


I’m trying to create a dhtmlx grid using angular 2 or 4. Have explored the dhtmlx documents and found gantt chart and scheduler sample demo application but I didn’t find any sample or any api documentation for angular grid . Is dhtmlxgrid supports angular version 2 or 4 and also please confirm the below feature is supported by angular dhtmlxgrid

  1. Basic add,remove,edit,delete functionality on grid
  2. Sorting and filtering
  3. Inserting row based on index
  4. Re-ordering by drag and drop
  5. Undo/redo(If I’m using inline edit)

Please do needful