react-calendar - why really slow when first opening a page with this webpart on it?

[IamNiteWalker]

Disclaimer

Yes

Sample

react-calendar

Contributor(s)

@Abderahman88, @Eli-Schei, @mohammadamer, @joaojmendes, @derhallim, @nanddeepn, @mohammadamer

What happened?

This is a great webpart, but when it is added it to a page, when you first open that page, it can take 30-45 seconds for it to load. Once in a while it errors out. When going back to the page within a few hours, the webpart loads within a few seconds.

That's it. I'd really like to use this calendar, but this slowness for my users is kind of a deal breaker.

Steps to reproduce

1. Add calendar to a page.
2. Open the page for the first time that day, or several hours after first open the page.
3. Calendar webpart can take 30-45 seconds to open.

Expected behavior

I'd expect a few seconds for it to load like it does after the first time it has been opened.

Target SharePoint environment

SharePoint Online

Developer environment

Windows

Browsers

• [ ] Internet Explorer
• [X] Microsoft Edge
• [X] Google Chrome
• [ ] FireFox
• [ ] Safari
• [ ] mobile (iOS/iPadOS)
• [ ] mobile (Android)
• [ ] not applicable
• [ ] other (enter in the "Additional environment details" area below)

What version of Node.js is currently installed on your workstation?

16.20.1

What version of Node.js is required by the sample?

v14 | v12 | v10

Paste the results of SPFx doctor

m365 spfx doctor -o text

CLI for Microsoft 365 SharePoint Framework doctor Verifying configuration of your system for working with the SharePoint Framework

√ SharePoint Framework v1.18.2 √ Node v16.20.1 √ yo v5.0.0 √ gulp-cli v2.3.0 √ bundled typescript used

Additional environment details

No response

[mohammadamer]

Hi @IamNiteWalker

We are working on improving the webpart. Today, I'm going to create a big change PR which will contain filtering events by category hopefully that this could help. one optional improvements could also be improve loading events because it's saved in local storage.