Calendar performance issues

[variable-content]

I'm submitting a ... (check one with "x")

[X] bug report => Search github for a similar issue or PR before submitting
[ ] feature request => Please check if request is not on the roadmap already https://github.com/primefaces/primeng/wiki/Roadmap
[ ] support request => Please do not submit support request here, instead see http://forum.primefaces.org/viewforum.php?f=35

Current behavior
Render speed is very slow when there are a large number (100+) of Calendar components on the page.

Expected behavior
Should be little to no lag to render.
Suggested fix is to only render of the calendar overlay when necessary (currently its rendered, but hidden with display: none;). I found that this dramatically sped up render times.

Minimal reproduction of the problem with instructions
Add this to the calendardemo.html template:
<button (click)="perfTest()">Perf Test
<div *ngIf="isPerfTest">
<p-calendar *ngFor="let i of arr" [(ngModel)]="date1">

And in the CaledarDemo component class:
export class CalendarDemo {
isPerfTest: boolean;
arr = Array(100).fill(1);
...
perfTest() {
this.isPerfTest = !this.isPerfTest;
}

Please tell us about your environment:
Windows 10

• Angular version: 2.X.X

• PrimeNG version: 1.1.4

• Browser: all

[ilianiv]

Accordion component has the same issue #1808

[variable-content]

PR to fix this issue is ready to be reviewed: #1817

[cagataycivici]

Merged 1817.

[cagataycivici]

Also removed creation of a new date for checking if day is today to reduce memory usage. Calendar performance has been improved significantly. Thank you.

[variable-content]

Awesome, thanks for taking a look!