Timeline tweening and as3 tweening. Animations run jerkily

[simon_lucas]

Problem

Animation jerky when published from Animate. CC, on a magic bar MacBook Pro 15" with 5k LG monitor attached.

This problem shows on two identical set-ups.

Description

When publishing from Animate (publish set to Flash Player or to AIR)

Two symbols tweening on the timeline run jerkily.

The frame rate drops  from 60 to 40 fps whilst the TweenMax animations run.

One greensock Tweenmax tween on a small symbol runs jerkily. But three of the same tween together are very jerky.

The frame rate fluctuates constantly between 60 and 32 fps whilst the TweenMax animations run.

Steps to reproduce:

stage size 1920 x 1080, fps 60.

A. Tweening in timeline

Create a circle symbol with gradient fill. 250 pixels x 250 pixels

Classic Tween one copy of the symbol from left stage to centre. pause it for 60 frames and play it backwards again

Add another copy on the right and move that one to the centre and back. Have the whole run timeline over 180 frames.

B. Tweening in AS3

With a small linked symbol 'Body' (gradient fill). Create a TweenMax tween on the x axis over two seconds, and set it to yoyo and repeat.

Add four of these to the stage at various y locations.

//needs greensock TweenMax

public function makeAThing(yloc:int):void{

  var c = new Body()

  c.gotoAndStop(1)

  addChild(c)

  c.x=100

  c.y=yloc

  TweenMax.to(c, 2, {x:800, repeat:-1,  yoyo:true, repeatDelay:1})

  }

Configuration and Equipment

MacOS Sierra 10.12.3

Adobe Animate 2017.1 release, build 16.1.0.86

Macbook Pro 15" 2.7Gz, 16Gb RAM, Radeon Pro 460, 4096 Mb

Monitor LG Ultrafine 27" 5k. Or Monitor LG Ultrafine 21" 4k.

Notes

Frame rate is more consistent when no external monitor used. But AS3 Tweens still jerky.

[Colin Holgate]

How does it perform on a device? What rendermode are you using?

[simon_lucas]

>How does it perform on a device? What rendermode are you using?

The runtime works fine on the target platform which is a Windows desktop machine.

When publishing and testing in Flash/Animate,  render modes do not have any effect on how fast Flash renders content. You can only access GPU rendering when using Stage3D (eg. Starling) or StageVideo. I am working with standard Flash content in the standard Flash Desktop Player, and the publish is set to Hardware Acceleration : None.

[Colin Holgate]

Some of what you say isn't quite right. Stage3D requires Direct rendermode, and won't work in GPU rendermode. StageVideo can work in either GPU or Direct rendemode.

In any case, Flash doing an AIR emulation may not give the best performance. A fairer test would be to try a test as regular Flash Player, then I would expect the performance to be as good as the final device build.

I see you say that you get the problem with Flash Player too. Would be interesting to do a debug test movie, see if that behaves any differently.

It does seem odd that TweenMax doesn't keep up with real time. Are you letting Greensock know about the problem too?

[simon_lucas]

You are right about the details of the modes, but it does not effect what I am doing, I think. I never change mode because I do not use Stage3D and am not using it here. So the render mode has no effect here. Correct?

Yes, I have used AIR emulation and Flash Player when testing in Flash/Animate. What is a debug test movie? You mean running in Animate IDE? That is what I am doing. I have also run as a desktop Flash Projector. I'm unclear how debug will give us any answers than I already have? I am running an FPS counter. there are no bugs in my code or errors. Is there something esle I can try?

Greensock have no interest as they do not develop for AS3 any more.

Also, the same problem is evident in simple Classic Tween timeline animations. So, at the moment, I see it as a problem with Animate and the new Macs. Maybe due to the high res displays.

[And by the way StageVideo runs terribly slowly too. Slower than a 2010 MacBook Pro.]

[simon_lucas]

should I just report this as a bug?

[Colin Holgate]

You might as well. Adobe may have a way to fix things without getting Greensock involved. Bug reports go here:

Feature Request/Bug Report Form

[simon_lucas]

Hi Colin,

Ok, I will. thanks for the link.

Of course it's not just greensock as I showed that it happens in Animate timeline keyframe classic tweens, too. So that really seems to put the ball in Adobe's court.

[Colin Holgate]

If you can give them a sample file, or use case, that doesn't involve Greensock at all, that would make them just think about the overall issue, and not be distracted by the Greensock variation.

[simon_lucas]

Good advice to include an FLA. Yes – I wish I'd even left greensock out of the description above- it just confuses things.

[simon_lucas · Accepted solution]

OK. I found out that setting Render to Direct when publishing fixes this.

Apologies to Colin, for not believing that render settings had any effect on anything other than Stage3D projects.

[Colin Holgate]

Thanks for reporting back. In addition to being needed for Stage3D, Direct rendermode also includes fast blitting of regular display list content. I used Direct in a lot of apps I've made, where there is no Stage3D content, but there is a lot of animation that would crash the app when using GPU rendermode. Direct is a lot better than CPU for that sort of content.