Ask coding questions

← Back to all posts
Pre-Rendering Images on HTML5 Canvas
FuriousTsunami (93)

Hi! I am currently working on a game that has a big number images to be rendered, every single frame of the game, in javascript. It is very laggy, so I tried to pre-render the images on a canvas element, and then draw that to the canvas, as shown in the code below. It doesn't work for some reason, but when I draw a rectangle on the canvas element, it works. I don't understand.

Answered by Coder100 (17111) [earned 5 cycles]
View Answer
Coder100 (17111)

try onload as well

waterImg.onload = () => {
  waterCtx.drawImage(waterImg, 0, 0, 50, 50);