help making a code better
hi guys im using this 2 together
1- is snow and ash
2- is a gradient rotating
but these 2 heavily impact performance and cause lag and slow moving on the damn site
so any advices would be appreciated for making them less laggy
here is the link for it
https://stackblitz.com/edit/vitejs-vite-4lmugs?file=style.css
though be careful its like rainbow god and Ground carousel had a baby
(its rotatey and changing background color & I CANNOT make it any better so u have to put it in codepen dont ask me I really cant)
9 Replies
hopefully this is the last question for a while
i saw this with my code but it works well other places
it should look sth like this
btw i run this on a kinda heavy site so yes I want this to have as minimum impact as possible
this was my whole past week lol i did sth and tadaaaa it didnt matter i get this instead lol jk
Usually when you have that repeating issue from top to bottom across the whole page it's because your html has no height. Which is common when there's no content on the page yet.
ohhhhhh so thats why intresting tnx π₯²
do u got any idea on the real issue though?
my initial thought was that the gradient rotation wasn't going to be running on the GPU because you're not using
transform: rotate(); for it. But turns out it's already on the GPU as is in both chrome and FF for me. Might still be worth trying the rotate though, maybe it will be a bit less of a performance hit?
I noticed the canvas has a thing were it shows a black background for a bit when I resize the screen. Might be a place to start but...
The reality is that if you really want/need this much movement on the screen ya might be better off making a video.You set a 100% height on the body. Make it 100vh, 100dvh, or 100svh.
guys please answer the main issue
why js and css together make it laggy and how to stop it