CreateJSのスプライトシートで時間ベースのアニメーションをする方法

スプライトシートアニメーションをスペックの異なるデバイス環境で同じように動作させたい
↓
フレームレートが異なるからアニメーションが違って見えてしまう
↓
時間ベースにすることで解決

// スプライトシートの作成
var spriteSheet:createjs.SpriteSheet = new createjs.SpriteSheet(data)
// アニメーションの作成
var effect:createjs.BitmapAnimation; = new BitmapAnimation(spriteSheet);
this.addChild(effect);

// 時間ベースのフレーム制御
var numFrames:number = effect.spriteSheet.getNumFrames("run");
var sec:number = numFrames/30 * 1000; // 総フレーム数 * 目標FPS * 1000(ミリ秒)
var effectFrame = 0;
createjs.Tween
    .get(this)
    .to({effectFrame: numFrames}, sec, createjs.Ease.linear)
    .call(function (event:any) => {
    // 不要になったら表示ツリーから削除
        this.removeChild(effect);
    })
    .addEventListener("change", (event:any):any => {
        effect.gotoAndStop(this.effectFrame>>0);
    });

※こちらは通常の方法

// タイムラインベースのフレーム制御
effect.onAnimationEnd = function (event:any) => {
    // 不要になったら表示ツリーから削除
    this.removeChild(effect);
};
effect.gotoAndPlay("run");