Improving the loading performance

Now the system selects some images that needs to be shown faster than the others and making them load with priority. It was made by selecting the images that the user is seeing and defining some params like fetchPriority = "high" and decoding="sync", the other images have the params: decoding="async"; loading="lazy"; contentVisibility="auto";. With that config the LCP went from 2.4s to 0.5s. Also it loads the image in the start and dont change that config again, so the browser will be lazy while downloading these images. The problem is: only the first images are chosen as high priority, but their positions will be changed while the configs stays the same, that makes the browser lazy while loading them and makes the runtime performance became worse.
To fix that i found about IntersectionObserver, that are meant to solve the problem of updating the images position fast. It was not applied yet, i found about it like 1 hour ago.

What else

• Now the perspective of the emotionDrum is based on the elements that it have, before it was based just in the screen and would broke if something changes.
• I did a little change in the way that the script checks for clicks in the screen, now it has more accuracy (I changed the round system).