Similar to Webgl animated texture performance versus canvas drawImage performance
I was experimenting with creating a visual novel's UI where I have the characters in an animation loop. Rather than having multiple variants I was thinking having a single large resolution video that I can zoom in and out as needed.
What I found (and also expected) is that using the <video>
tag to display them taxes the system and I think GPU as well since the video tag itself is being hardware accelerated for rendering.
My question is:
Rather than having the videos in DOM, I would draw it in a canvas but then I'm wondering if this method will consume less GPU/CPU resources? Also If possible... how would one do that?