search

CreateJS / TweenJS

A simple but powerful tweening / animation library for Javascript. Part of the CreateJS suite of libraries.
http://createjs.com/
MIT License
3.56k stars 967 forks source link

How to use different timingMode in one project? #87

Closed holiber closed 7 years ago

holiber commented 8 years ago

Hi! I have 2 different components on my page. Each of them uses tween.js for animation, but one of them should work with Ticker.timingMode = Ticker.RAF and another one should work with Ticker.timingMode = Ticker.TIMEOUT. So as Ticker is a global variable, I have no idea how to implement this. Maybe, it's possible to call ticks manually for each component?

lannymcnie commented 8 years ago

This isn't currently possible. Multiple Ticker instances are on our roadmap though.

You can however set a framerate on any MovieClip or Sprite to get the speed you want.

lannymcnie commented 7 years ago

There is multiple Ticker support in an internal ES6 branch that is in progress (currently private). Leaving this note here to remind @tehvgg/@gskinner to look at a solution for specifying a Ticker on a specific Tween.

gskinner commented 7 years ago

@holiber - can you provide more insight into why you are using two different timer mechanisms?

holiber commented 7 years ago

@gskinner I have many WebGL scenes that use TweenJS on a page. One of them is detail scene and other are preview scenes. Detail scene must render animations as fast as possible but preview scene must render animations only once per second by performance reason.

gskinner commented 7 years ago

Usually rendering the stage is the vast majority of the performance cost. Unless the actual tweens are really expensive, I'd consider just adding a bit of code to only update the preview stages every second. You could even do this using tween potentially:

createjs.Tween.get().wait(1000).call(updatePreviewStages);

If you did want to throttle the tweens as well, you could pause the preview tweens to remove them from the managed Tween list, and write a small script/class that uses tween.advance(1000) to advance them every second.

Let me know if that makes sense.