Could anyone offer some insights on the performance issues I am facing with Angular 6? My page contains a large table with 100 rows and 100 columns each. Despite not having any data exchange with the table, using libraries like ng-select or ng-bootstrap datepicker results in lag when interacting with them. For example, even if the ng-select dropdown is empty, it takes about half a second to open and close. The same laggy behavior occurs with other libraries as well. Interestingly, reducing the table size to just 10 rows significantly improves the lag issue. Why might this be happening?
I've noticed that when I opt for native HTML tags such as select option, there is no lag at all - everything reacts instantly. How can I enhance the performance in my specific scenario? Appreciate any guidance! Here's a snippet of the code:
app-component:
<ng-select></ng-select>
<row-component *ngFor="let basket of baskets"></row-component>
row-component:
<div *ngFor="let apple of apples">
blah blah blah
</div>