[WIP] Effects: Use requestAnimationFrame timestamp if available

In some environments that support the requestAnimationFrame timestamp callback
parameter using it results in smoother animations.

Fixes jquerygh-3143

src/effects.js

@@ -27,19 +27,29 @@ var
  rfxtypes = /^(?:toggle|show|hide)$/,
  rrun = /queueHooks$/;
 
-function raf() {
+function raf( timestamp ) {
  if ( timerId ) {
  window.requestAnimationFrame( raf );
- jQuery.fx.tick();
+ jQuery.fx.tick( timestamp );
  }
 }
 
+// We need to be using jQuery.now() or performance.now() consistently as they return different
+// values: performance.now() counter starts on page load.
+// Support: IE <10, Safari <8.0, iOS <9, Android <4.4, Node with jsdom 9.4
+function getTimestamp() {
+ if ( window.performance && typeof window.performance.now === "function" ) {
+ return window.performance.now();
+ }
+ return jQuery.now();
+}
+
 // Animations created synchronously will run synchronously
 function createFxNow() {
  window.setTimeout( function() {
  fxNow = undefined;
  } );
- return ( fxNow = jQuery.now() );
+ return ( fxNow = getTimestamp() );
 }
 
 // Generate parameters to create a standard animation
@@ -631,12 +641,12 @@ jQuery.each( {
 } );
 
 jQuery.timers = [];
-jQuery.fx.tick = function() {
+jQuery.fx.tick = function( timestamp ) {
  var timer,
  i = 0,
  timers = jQuery.timers;
 
- fxNow = jQuery.now();
+ fxNow = timestamp || getTimestamp();
 
  for ( ; i < timers.length; i++ ) {
  timer = timers[ i ];

test/unit/effects.js

@@ -17,15 +17,32 @@ QUnit.module( "effects", {
  this.sandbox = sinon.sandbox.create();
  this.clock = this.sandbox.useFakeTimers( 505877050 );
  this._oldInterval = jQuery.fx.interval;
+ this._oldPerformanceNow = window.performance.now;
  jQuery.fx.step = {};
  jQuery.fx.interval = 10;
+
+ // Fake performance.now() returning lower values than Date.now()
+ // and that its values are fractional.
+ // Support: IE <10, Safari <8.0, iOS <9, Android <4.4, Node with jsdom 9.4
+ if ( window.performance && typeof window.performance.now === "function" ) {
+ window.performance.now = function() {
+ return Date.now() - 99999.6394;
+ };
+ }
+
  jQuery.now = Date.now;
  },
  teardown: function() {
  this.sandbox.restore();
  jQuery.now = Date.now;
  jQuery.fx.stop();
  jQuery.fx.interval = this._oldInterval;
+
+ // Support: IE <10, Safari <8.0, iOS <9, Android <4.4, Node with jsdom 9.4
+ if ( window.performance && typeof window.performance.now === "function" ) {
+ window.performance.now = this._oldPerformanceNow;
+ }
+
  window.requestAnimationFrame = oldRaf;
  return moduleTeardown.apply( this, arguments );
  }