I’ve created a small project where I tried to produce an effect similar to the Final Fantasy 8 screen transition effect.
You can see a video of the original effect here and my project in action here.
The code is accessible through the GitHub repository.
Whilst I’m a Firefox user I had to resort to refreshing the page on Firefox as it leaked an amount of memory the size of the canvas’ image data. This leak wasn’t present on Chrome, Edge or Safari.
I’m writing directly to the image data like a buffer, which I found out is far from optimal. It’s far better to stick to drawing primitives from the API (much faster) but this ultimately limits what you can do which is why I stuck with direct operations on the image data.
