Velocity.js をつかってスムーズなアニメーションを実現する

Velocity.js

職場の後輩に教えてもらいました。
jQueryアニメーションのようにつかえてjQUeryアニメーションよりさくさく動くと評判らしいです。

Velocity

JavaScript

$(function() {

    "use strict";
    
    var $box = $("#box"),
        MS = 1000;

    (function anim() {
        $box.velocity({
            margin: -25,
            width: 50,
            height: 50
        }, MS, "swing").velocity({
            margin: -50,
            width: 100,
            height: 100
        }, MS, "swing", anim);
    })();

});

jQuery

JavaScript

$(function() {

    "use strict";
    
    var $box = $("#box"),
        MS = 1000;

    (function anim() {
        $box.animate({
            margin: -25,
            width: 50,
            height: 50
        }, MS, "swing").animate({
            margin: -50,
            width: 100,
            height: 100
        }, MS, "swing", anim);
    })();

});

これぐらいのアニメーションだと差を感じませんが、全然さくさく動くらしいです。
jQueryのanimateとインターフェイスがおなじなので、velocity.jsを読みこめば、animateの部分をvelocityに書き換えるだけで導入できます。とても助かりますね。