Chrome and safari performance

[GustaveD]

Hello, I observe sorts of "lags" on chrome and safari (firefox is very fluid). Is it normal or it is me who makes too many animations at the same time. Thank you ! :)

I am doing this kind of things :

while (j < 10) { var image = draw.image("image.svg"); image.size(50,50); image.animate({ duration:20 000, delay: 3000, when:"now" }).move(-150, y).loop(true, false); j++; }

[Fuzzyma]

Animations should be fluid (we sped this up a lot with the release of v3. However what you can try is waiting till all images are loaded before starting to animate them. You can utilize promises together with the loading callback for that and wait for them to resolve:

const imagePromise = (draw, url) => {
  return new Promise((resolve, reject) => {
    draw.image(url, resolve).on('error', reject)
  })
}

const promises = []
while (j < 10) {
  promises.push(imagePromise(draw, "image.svg"))
}

Promise.all(promises).then((images) => {
  new List(images).animate({ duration:20 000, delay: 3000, when:"now" })
    .move(-150, y)
    .loop(true, false);
})

// EDIT:

Ofc you can also try the profiler of safari and chrome to figure our were all the time is spend

[keyone2693z]

same issue

its have a poor performance in Chrome and Safari but it's working perfectly fine in Mozilla