Documentation webpage using 100% of CPU

[jsphkm]

I'm noticing that the redux documentation website is using 100% of my CPU.

The reading comes from my mac's Activity Monitor and Safari alerting this:

This webpage is using significant energy.  Closing it may improve the responsiveness of your Mac.

This issue is consistently replicable with this page for now, https://redux.js.org/recipes/server-rendering

Using:
Safari 13.0.4
16" MacBook Pro

I was unable to replicate this on Chrome

[markerikson]

Hmm. Not sure what to tell you. It's primarily a plain static HTML file, and whatever JS is getting loaded on that page really shouldn't be doing anything fancy.

[timdorr]

Sounds like an extension gone bad. Nothing we can do about that.

[jsphkm]

Am I the only one experiencing this?

I had just one Safari extension called Bear, so I deleted the extension and the app since I don't use it.

Empty Cache - same issue
Restarted Safari - same issue
Restarted Computer - same issue

Activity monitor shows 100% instantly

This is my activity monitor as soon as I restarted my computer like stated above,
the only opened webpages are this GitHub issue page and the redux page:

[jsphkm]

Do you think it has something to do with cache? Maybe the Safari is busy caching the pages?

It seemed like deleting cache and then restarting the computer fixed it for about less than a minute, until it showed up with 100% again.

[timdorr]

Looking at the Timeline in the dev tools, it's something with the CSS. The styles are getting invalidated constantly.

However, this only occurs on the home page. Since folks don't tend to hang out there long, I'm not particularly worried about it. I also noticed that Docusaurus's site doesn't suffer from this issue, so perhaps it's an upstream fix we'll get shortly.

[markerikson]

Poking @yangshun and @wgao19 as an FYI, as this sounds like a Docusaurus issue.

[yangshun]

We've received similar reports as well. It's probably a Safari bug but we could try to prevent instances of styles that will trigger the bug.

[yangshun]

Found the issue. It's due to the use of transition: all within .navbar__search-input. Disabling those lines in the web inspector fixes the CPU issue. We'll push out a fix.

[yangshun]

[email protected] has been released which contains the fix.