CSS3のcubic-bezierの書き方でjQueryのeasingを生成する

CSS3のアニメーションでtiming-functionを指定する際にcubic-bezier関数が使えますが、
同じ書き方でjQueryのeasingを生成できるプラグインがあります。

https://github.com/rdallasgray/bez

CSSで書くこのようなアニメーションを、

#sample {
    left: -100px;
    transition-property: left;
    transition-duration: 0.5s;
    transition-timing-function: cubic-bezier(0.02, -0.55, 0, 0.11);
}

直感的にjQueryのアニメーションに置き換えられます。

$("#sample").animate({
    left: '-100px'
}, 500, $.bez([0.02, -0.55, 0, 0.11]));

ちなみに[0.02, -0.55, 0, 0.11]は、コーデュートのコンボカウントのエフェクトで使用している値です。

元々コンボのエフェクトはCSSアニメーションで実装していたんですが、環境によってはキーを押したときの反応が鈍くなったため、JavaScriptでの実装に変更しました。

ただ、最近のブラウザは超スピードで進化し続けているので、高速化を図るときは俗説にとらわれず最新ブラウザの挙動を常に観測していく必要があるなーと感じました。