HTML5 Canvas animation run slow on Chrome Mobile

Explorer ,
Feb 24, 2021 Feb 24, 2021

Copy link to clipboard

Copied

Hi everyone, on Chrome mobile browser, my animation suddenly drop its fps (normal it's 30fps, but on Chrome mobile, I think it's 1-2 fps, very lagging). The thing is it's only happened to some project, and it's working fine on Chrome windows and other browsers.

 

I have add this meta to header but it's still run slow:
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0, viewport-fit=cover" />

 

I also run these scripts but not helpful:
https://helpx.adobe.com/animate/using/tip--html5-optimization.html

 

I also change all my tweens to classic tween (before that they are motion tweens) and remove every frames that aren't need. Not helpful.

 

My last resort would be change it to Bitmap instead of using Illustrator import. But that'll take a lot of efforts because these projects have many images.

 

Please, anyone, help me.

Link to my animation: https://angry-jones-e2ad12.netlify.app/

Views

944

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
May 14, 2021 May 14, 2021

Copy link to clipboard

Copied

I have the same problem with my animations no matter how simple they are.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
May 30, 2021 May 30, 2021

Copy link to clipboard

Copied

 

your animation works smoothly on mobile Chrome for iOS (iphone 12 mini).

your issues are on Android I assume?
can u give info about what device / Android version etc...?

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jun 15, 2021 Jun 15, 2021

Copy link to clipboard

Copied

LATEST

Yes, it's lagging on Android Chrome. My device tests are various from Android 9, 10 such as Realme 5 Pro, Redmi Note 9, Samsung Galaxy A6, etc... The lower Android ver, the worse.

On iOS Chrome, it's less laggy, but low spec devices are not really smooth. It's just acceptable.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines