CPU usage @ 99%

[bliitzkrieg]

I have a spline scene and its shooting my CPU usage to 99%. I've tested this on Chrome, Brave & Firefox and on all three are having the high CPU usage. It's making the page the scene is running on feel sluggish. Any recommendations on making this more performant?

I've also testing the demo scene provided by the Spline platform and that also has the high CPU so its not unique to my implementation.

This is my implementation anyways:

import Spline from "@splinetool/react-spline";

const AnimationContainer = styled.div`
  position: fixed;
  left: 25vw;
  right: 25vw;
  top: 25vw;
  bottom: 25vw;
  z-index: -1;
`;

...

<AnimationContainer>
  <Spline scene="SCENE_URL" />
</AnimationContainer>;

[marcofugaro]

Please share a reproducible example and your device specifications.

[bliitzkrieg]

https://stackblitz.com/edit/react-kmset6?file=src/App.js

If you inspect the CPU usage, its chugging at 100% utilization. I'm running it on a windows PC with a GTX 1080 graphic card

[bliitzkrieg]

We've tried to reduce the polygon count of our scene to see if that would help with the performance and it had no effect. I also confirmed with multiple people they experience the same issue to rule out if its unique to my PC.

[tfarhan00]

Even till this day the performance is still really bad, the only workaround for me is export the object as .gltf and use react-three-fiber instead which of course eliminate the benefits. I'm always ended up with blender :)

[hotellonely]

I feel like they've dropped the support for react or even vanilla js's spline-runtime. The events supported is horrifyingly limited and the performance is down in the drainage...

[bliitzkrieg]

bump