I have a simple animation that moves up and down, but it has terrible lag and is very unaesthetic.
The hype doc is included so you can see:
LAG.hype.zip (275.5 KB)
Perhaps You have your reasons but the animation timeline was quite long. I cut the timeline to down to 7 seconds from 15 - i.e. moves twice as fast - looks fine at this speed IMO.
@JimScott I’ve had much more complicated animations not play up, how come I have to speed this up to make it smoother?
Either way, it fixed my problem 
1 Like
S-l-o-w and smooth seems to be a problem for Hype - others have noted it also. I am not sure of the exact parameters that result in the jerky or lag visual - e.g. what is the “slow” threshold precisely, and how is slow affected by other animated actions; then throw in various browser issues. This sort of cogitation often requires another cocktail ;->
In Hype 3.5 we improved the situation significantly by being able to use fractional pixel rendering in most cases. This document has "Position with CSS left/top" turned on in the Document Inspector, which uses the older, pixel boundary method.
If you turn off "Position with CSS left/top" I believe you'll find that the animation is significantly smoother. (This is the default for any new documents, but older documents have it on to ensure scripts don't break just by upgrading).
2 Likes
[Here] (https://dl.dropboxusercontent.com/spa/lyxszk5uyjw9g12/Exports/Scene_ReturntoTime/Scene_ReturntoTime.html) is an example of what I was talking about in my post above. This link is to a Hype Demo that I did today as part of an answer to someone's questions on this Forum. Hype Project here: Scene_ReturntoTime.hype.zip (27.7 KB)
This animation is just about as simple as it gets: a small Hype generated graphic going back & forth on a timeline. (I am referencing just "Scene 1" here, not "Scene 2" with the rotating square).
All of four major browsers do not render this animation in a smooth fashion, though each displays a slightly different result. The "Position with CSS left/top" is off. "Use Webkit graphics acceleration" is on (turning it off made no difference for the non-webkit browsers, as would be expected - but for Chrome & Safari - WebKit "off" was really bad animation).
I have had much larger JPGs & PNGs do just fine, and others not as well. I have yet to discover exactly why there is this variance - and why there is any issue at all for small basic graphics.
Although this animation was fine for me, I’ve noticed that moving grouped of items that are also moving cases a lag. E.g. a bunch of items individually spinning are in a group, and the group itself is moving up and down. I found that this lagged a lot vs giving them all their individual animations without a group one. Takes a little longer, but the result is profound.