Poor performance on iPhone 6S

Hello, I have a scene with 2 very simple animation loops. The only thing happening on this scene (attached) is those two fans rotating.

This is a build done with Xcode 11 viewed on an iPhone 6S.

As you can see, the rotations is jerky and not smooth on an iPhone 6S. Now, that iPhone model is still pretty popular, so it is important that the app appears as smooth as possible on those older devices. And I would think that 2 minor animations of the same SVG file wouldn’t be a problem. But it is.

Is there a way to make this less jerky? Are PNGs (which are larger files) better for this than SVGs? Is there just no way around older devices with Hype

?

That does seem unusually slow. An iPhone 6s is generally plenty fast for most basic animations in Hype. SVGs definitely can have very different performance characteristics and often can be much slower depending on the image. I’d say for quick fixes you could try:

  • Uncheck (or re-check) Enable WebKit Graphics Acceleration in the Document Inspector
  • Check position with CSS left/top
  • Change SVGs to PNGs (keeping the resolution as small as possible and file size small via ImageOptim or other techniques)

Beyond that it would probably be document dependent, and probably based on how much scaling is happening across layers or if there are any filter effects.

Thank you Jonathan for your reply.

There is a lot of scaling going on. The app is fully responsive from an original iPad size, so on an iphone things are scaled down.

Ive changed it to PNG and reduced the size with TinyPNG and didn’t do much. Can’t remove the CSS left/top or things get out of wack for me. I did remove the WebKit Acceleration and made things considerably worse even on my powerful iMac.

What is weird is that as I navigate through the app (it has more than 40 scenes) and then go back to that initial screen that I posted, then the animation is perfectly smooth. Could it have something to do with loading all the different elements? That once all are loaded then it runs more smoothly?

I don’t need to go through the entire app. Just by going to 5 or 6 different scenes then back to that initial scenes all animations are smooth. If however, I don’t move from that initial scene, the animation is jerky even after 5 minutes.

Hey Jonathan, I found out the problem. It wasn’t that I needed to navigate to different scenes to load. I needed to navigate to a particular scene that had OnDrag control timeline. That was it. No other scene has that functionality.

After removing that scene now the animations run smoothly. Why would that be?

I wouldn’t expect an On Drag event to have any performance impact!

Would you mind sending me the .hype doc and .xcodeproj files if you have some time, along with any steps needed to get to the scene and reproduce? I’d be curious to figure out what is going on. If you can, please send the slow version and the revised fast version.