V2 Calendar Component Very Slow

Hey All,

Having migrated a page with the V1 Calendar to V2, it appears the component itself loads and displays data extremely slowly, if it doesn’t bog down the page and load at all. I have tested the same models with table components, and they all load quickly (with more data as it doesn’t have the built date filters going from the monthly calendar). Looking through some other topics it seems like this has been an issue for others in V2 as well.

Does anyone have a fix or solution to get faster load times? I am using all best practices for page speed. This is a major feature in our app and will cause issues for users trying to utilize calendars in V2. V1 Calendar loaded very quickly and was pretty user friendly.

Hey Grant, sorry to hear this!

I’m investigating to see if there’s any performance recommendations for the calendar but haven’t found anything yet. In the meantime can you tell me more about your page so we can try to reproduce this issue on our side?

  1. How many models do you have?
  2. How many records are your models bringing in?
  3. How slow is slow? It sounds like sometimes the page doesn’t load at all?
  4. What’s the runtime? Page Preview? Lightning?

If you’re able to create some sort of test page with standard objects that exhibits the same behavior, that would be really helpful, and then I can just make sure the org I import it into has a similar size data set.

So we are using it in several places. There is one main calendar page that is presenting the biggest obstacle to converting the userbase to V2. It is using 15 models to bring in the Event Sources. I have each model limited at 100 records (In V1 they were set to 300ish) and there are some instances where that is not enough record to view all the events in a month. For the users that can see event across a large area it takes minutes to load, or sometimes not at all. I have implemented filters to be able “turn off” some of the event sources to try and alleviate things, but that doesn’t seem to help much. The same number of records used to load quite quickly in the V1 calendar. I did test the same models with tables, and they loaded in an acceptable amount of time (a few seconds) so it appears to have to do with the component itself. Thanks for looking into it!

Thanks for the detail Grant. Out of curiousity - what version of Skuid are you running?

We are currently using Edinburgh Update 1 (16.1.8.0)(SFX) in our sandbox, getting things ready to update the production environment from a much older version. I should also mention I am using some HTML in the calendar “cards” as the users need to see several fields of data without clicking and that’s the only way I saw to get line breaks to fit the data in the space. I have tried it without the HTML and saw the same type of load/render times.

I’ve been trying to test “big content” calendars and have not seen similar problems with rendering. 300 or 400 events in the same month? BANG. HTML – BANG. Its fast.

The calendar component does re-render more often than some of our other ones - and it is COMPLICATED. But I’ve not been able to break it. SO some questions.

Can you give me a sense of how many events are in your 15 sources, and how many you are expecting to see in a single month or week view?

What are those 15 sources? (You can be vague).

Any other ideas that would help me build a reasonable repro.

Did a little additional testing to try and diagnose further. On average the most records I would see a month as an Admin that can see all is around 650 total from all sources. The most a user with a large scope would see maybe 200-250 max. None of that seems crazy and I did test again with tables and it loaded almost instantly. Went back to the calendar component on the same user and it bogged the page down and was unresponsive. When I tried from my admin view I got an apex heap size warning even though I had loaded the same 600 records a moment earlier with tables with no issue.

One thing I did think of from your question on the sources. 14 of the 15 sources are all models on the same Event object with different conditions (ie a category condition). Could it be better to try loading them all in through one model for the one object? Although still the tables loaded all those different models instantly.

Most users would want to see all their events on their monthly calendar. I have built some filtering for them to be able to pare down which ones they want to see, but the standard would be to load all records initially.

Hopefully this helps and I appreciate you guys looking into it!