jQuery fx raf patch

jQuery 3.0.0からアニメーションの更新にrequestAnimationFrameを利用するようになり、このメソッドに対応したブラウザではアニメーションが滑らかに表示されます。そこで、v1.9.0〜とv2.0.0〜でもこのメソッドを利用できるように、v3.0.0 Alpha1のコードから更新間隔の設定をしているところを抜き出してみました。jQuery本体の読み込み後に実行すると対応したコードに書き換わります。

// Quoted from jQuery JavaScript Library v3.0.0-alpha1

(function(window, jQuery) {
	var timerId;

	function raf() {
		if ( timerId ) {
			window.requestAnimationFrame( raf );
			jQuery.fx.tick();
		}
	}

	jQuery.fx.start = function() {
		if ( !timerId ) {
			timerId = window.requestAnimationFrame ?
				window.requestAnimationFrame( raf ) :
				window.setInterval( jQuery.fx.tick, jQuery.fx.interval );
		}
	};

	jQuery.fx.stop = function() {
		if ( window.cancelAnimationFrame ) {
			window.cancelAnimationFrame( timerId );
		} else {
			window.clearInterval( timerId );
		}

		timerId = null;
	};
}(window, jQuery));

animate拡張プラグイン「jQuery.bezierCurve」を使った動作デモです。requestAnimationFrameに対応した環境では滑らかなアニメーションになっていると思います。