Page becomes unresponsive when using customized events

[irshad ahmad]

Hi Team,

Customer Id : 1185159

We are using Sync Fusion Scheduler component in our Angular Project.

We have customized the events based on our requirements. But we are facing performance issues. Browser is taking too much time to render complete page, sometimes it’s showing Page not responding error message.

There are few questions which we need answers. We tried looking on support pages of sync fusion but couldn’t find any proper solution.

We want to know if we can implement progressive scroll (both vertical and horizontal ) on the calendar so that it will only render the current viewport html code.

another thing we want to know is that any option to avoid refreshing whole calendar on updating any one event.

Looking forward to your response.

Thanks,

Irshad.

[Vinitha Devi Murugan]

Hi Irhsad, 

 

Greetings from Syncfusion Support. 

 

Q1: We have validated your reported issue “We have customized the events based on our requirements. But we are facing performance issues. Browser is taking too much time to render complete page, sometimes it’s showing Page not responding error message” at our end by preparing sample with event template. But unfortunately, we were unable to replicate the issue at our end. We have shared the working sample for your reference. 

 

Sample: https://stackblitz.com/edit/angular-performance-issue-checked-with-event-template?file=app.component.ts  

 

Kindly try the above sample, If you still face the problem at your end, share the below details with us to serve you better. 

 

1. Share the Scheduler rendering codes
2. Share the number of resources and number appointments loaded in Scheduler.
3. Share your Syncfusion package version.
4. Share more details with video demo that illustrates your problem

 

Q2: We have validated your reported query “We want to know if we can implement progressive scroll (both vertical and horizontal ) on the calendar so that it will only render the current viewport html code” at our end and we suggest you to use our virtualScrolling feature for better performance, when use more number of resources (more than 50 resources). We have added virtual scrolling support in the timeline views to load a large set of resources and events instantly as you scroll. 

 

For more information, please refer below documentation links. 

UG: https://ej2.syncfusion.com/angular/documentation/schedule/virtual-scrolling/  

Demo: https://ej2.syncfusion.com/angular/demos/#/material/schedule/virtual-scrolling  

 

Currently we have virtualization support for Agenda view and Timeline views, we have already logged the feature request to implement virtualization in vertical views which can be tracked through the following link.  

 

https://www.syncfusion.com/feedback/3560/virtual-loading-of-appointments-and-layout-in-vertical-views  

 

Q3: We have validated your reported query “that any option to avoid refreshing whole calendar on updating any one event” at our end and let you know that updating any event in the scheduler will not refresh the entire scheduler; instead, it will only refresh the events in the scheduler. While modifying the event, we suspect you may have updated the eventSettings.dataSource property in your application. So please share your code snippets or issue replication sample or video demo that illustrates your problem to provide prompt solution or please share your convenient time to schedule a web meeting to check the issue directly in your machine to provide a prompt solution. 

 

Regards, 

Vinitha