Invisible sync: hides showcases until fully loaded, then fades them in perfectly synced. No buttons.
Automatically synchronizes all animated Steam showcases (Artwork, Workshop, Screenshots) to start at the exact same frame.
Steam loads images sequentially. If you have a split artwork (like a long background cut into pieces), the pieces often load at different times, causing the animation to be out of sync.
Usually, you have to refresh the page 5-10 times to get it right. This script fixes it permanently.
HTMLImageElement.decode() API. It does NOT use blobs or external fetches, making it 100% compliant with Steam's strict security policies.The script works on both Public Profiles and the Edit Profile page.
🔬 Technical Explanation (How it works)
1. Detection: The script finds all showcase images on the page.
2. Hiding: It immediately applies opacity: 0 to them so you don't see the desync.
3. Preloading: It creates new Image objects in memory and appends a timestamp (?t=...) to bypass the browser cache.
4. Decoding: It uses the asynchronous .decode() method to force the browser to rasterize all frames in the GPU/RAM.
5. Swap: Once Promise.all() confirms all images are decoded, it swaps the sources and fades them back in (opacity: 1) in the same Animation Frame.