Choppy Animation

Performance
1

Hi Everyone,

I’m having an issue with a seriously choppy animation. My assets are less than 700kb and my animations are’t too complicated (At least I don’t think). It runs the same in both my computer’s browser, my phone’s browser, when using Hype reflect and even in the project. I can’t figure out what’s going on.

Any ideas why this file is playing so badly?

Thanks!

L.

animation project.zip (1.0 MB)

2

@lriley3,
I sense you have a lot going on towards the end of the animation, where Safari, Chrome, nor Firefox can even keep up on the browsers’ side. Do you think you can go with exporting the file as a movie instead? As a video, its looks exactly as intended on the timeline.

Best Regards,
techgiant2000

3

@techgiant2000

If you look in the file there isn’t a lot being animated.

@lriley3

I can narrow it down to the houses.svg for some reason this is a lot bigger (in size) than the rest (in comparison) and if you hide it or delete then things seem to run a lot smoother. Why is the houses.svg so big? I would look at the information in the file.

D

4

@lriley3, I agree with @DBear, as I have followed the same steps.

Yet, the animation doesn't seem to loose a beat in timeline when exported, as is, to movie file.

Just sayin',
tg2k

5

Thanks @techgiant2000 and @DBear! I think you’re both right!

The files that I was using included a large SVG file (Houses.svg). When compressed and converted to a PNG it played perfectly. I think it had to do with both the weight of the file and the fact that there was a lot of heavy SVG resizing going on at once.

Thanks for the help!

L.

1 Like
6

This post is more than a year old, but I assume that it will continue to attract some users.

Re: PNGs - Photoshop’s save for web feature works well but the file sizes could be reduced further. Use a tool such as TinyPNG to strip out the unnecessary content of the PNG file. You could see a drop in file content by at least half.