Hello, I would like to know if there is any difference (in performenc etc.) when using atlas over the individual images to draw on canvas.
In code example are shown these two approaches.
Thank you!
// Example1 - individual images
let framePointer = 0
const animationFrames = [frame, frame2, frame3,...] // images are HTMLImageElements
//rendering
ctx.drawImage(animationFrames[framePointer], 0,0)
framePointer ++
// Example2 atlas
let atlasPointer = 0
const atlas = new Image()
atlas.src = 'atlas.png'
const atlasMap = [{x,y,width,heigth},...]
//rendering
let frameInfo = atlasMap[atlasPointer]
ctx.drawImage(
atlas, // HTMLImageElement
frameInfo.x, //source x
frameInfo.y, //source y
frameInfo.width, //source width
frameInfo,height, //source height
0, //destination x
0, //destination y
frameInfo.width, //destination width
frameInfo,height, //destination heigth
)
atlasPointer ++
