Quantcast
Channel: Recent Questions - Stack Overflow
Viewing all articles
Browse latest Browse all 12201

Transparent / Absolute Canvas above animation causes GPU glitches

$
0
0

I made a small one pager which uses framer for scroll animations. I wanted to add a small smoke effect when scrolling past over a certain section.

The overall effect seems to function but it wrecks the whole sites performance on chrome.

It runs smooth on Firefox so it almost seems as if chrome doesn't use hardware acceleration.

Here is the scrolling animation on chrome

Chrome
and on firefox

Firefox

Please see this page on Firefox vs Chrome:
https://ghettogoethe-git-feat-smoke-c5h8nnao4s-projects.vercel.app?_vercel_share=1mwhvH8awz6k9zTbbQ1FWuNAwWjZ0Dw3

My Chrome GPU settings say the followingenter image description here

Sometimes it runs smooth on Chrome, but 95% it lags and glitches and is almost unusable.

Fix:Setting the ANGLE graphics backend to D3D11on12 fixes the issue.enter image description here

How can I make sure this runs smoothly on all Chrome browsers regardless of this setting?


Viewing all articles
Browse latest Browse all 12201

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>