istio.io
istio.io copied to clipboard
istio
High CPU usage on istio.io homepage
Seeing at least 60% CPU usage on the Istio.io homepage on Safari, Chrome and Firefox browsers on my Mac. No CPU spike on the other pages on the site, only the main page. Similar .io website rarely hit double digits.
It will be the particle animation (https://github.com/istio/istio.io/blob/master/src/ts/headerAnimation.js). It uses Three.js to draw the waves.
Options include: improve performance of the JS, convert it from canvas/JS to pure CSS rendering, replace it with a static graphic, remove it entirely.
Marking "help wanted" as the vendor who built this is not longer available to us.
@craigbox The graphic was my guess as well. tetrate.io was one of the other sites I checked, and it has a moving graphic on the homepage and the site doesn't hit the double digits. I didn't check their source to see how it was done but figured the CPU comparisons warranted opening an issue at least for tracking purposes.
Theirs is a looping .webm video. Perhaps Tetrate have some frontend devs who could have a look at istio.io for us? 🙂 @ZackButcher
Hello, This is an intersting one and Would take this up and investigate further. As @craigbox mentioned, it should be caused due the animations and usage of high GPU and Rendering required to process for istio landing page.
Request to assign it to me.
My knowledge of Three.js is a bit rusty but I have an idea on why the cpu is affected. I will take a look into this when I have a bit of time and I will rewrite it to work in a more efficient way
