Skip to content

Instantly share code, notes, and snippets.

@ptbrowne

ptbrowne/index.html

Forked from anonymous/index.html
Created April 28, 2016 13:59
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ptbrowne/cfe8318854b72ec1c9e62935a76ce54f to your computer and use it in GitHub Desktop.
Save ptbrowne/cfe8318854b72ec1c9e62935a76ce54f to your computer and use it in GitHub Desktop.
Download ZIP
JS Bin // source http://jsbin.com/jicajamohu
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/jasmine.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/jasmine-html.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/boot.min.js'></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/jasmine.css" />
</head>
<body>
<script id="jsbin-javascript">
console.clear();
var framerateThrottle = function (f) {
var ticking = false;
var _this, _args, _id, _lastIdCalled;
var nextCall = function () {
f.apply(_this, _args);
_lastIdCalled = _id;
lastId = _id;
};
var tick = function () {
if (ticking && _lastIdCalled !== _id) {
nextCall();
requestAnimationFrame(tick);
} else {
end();
}
};
var start = function () {
ticking = true;
tick();
};
var end = function () {
ticking = false;
_this = _args = _id = _lastIdCalled = null;
};
return function () {
_this = this;
_args = arguments;
_id = Math.random();
if (!ticking) {
start();
}
};
};
var runInNumberFrames = function (fn, n) {
var count = 0;
var start = new Date();
var w = function () {
var delta = new Date() - start;
if (count != n) {
count++;
requestAnimationFrame(w);
} else {
fn();
}
}
w();
}
describe('framerate throttle', function () {
var fn;
var res = [];
beforeEach(function () {
fn = framerateThrottle(function (x) {
res.push(x);
});
res = [];
});
it('should run the first immediately and the last', function (done) {
for (var i of [1,2,3,4,5,6,7,8,9,10]) {
fn(i);
}
expect(res.length).toBe(1);
requestAnimationFrame(function () {
expect(res.length).toBe(2);
done();
});
});
it('should be called once per frame', function (done) {
fn(0); // called immediately
fn(1); // not be called since fn(2) supersedes it
fn(2); // called
expect(res.length).toBe(1);
runInNumberFrames(function () {
expect(res.length).toBe(2);
done();
}, 2);
expect(res.length).toBe(1);
});
it('should be called once per frame 2', function (done) {
fn(0); // called immediately
fn(1); // scheduled for next frame
runInNumberFrames(function () {
fn(2);
}, 1);
expect(res.length).toBe(1);
runInNumberFrames(function () {
expect(res.length).toBe(2);
}, 1);
runInNumberFrames(function () {
expect(res.length).toBe(3);
done();
}, 2);
expect(res.length).toBe(1);
});
})
</script>
<script id="jsbin-source-javascript" type="text/javascript">console.clear();
var framerateThrottle = function (f) {
var ticking = false;
var _this, _args, _id, _lastIdCalled;
var nextCall = function () {
f.apply(_this, _args);
_lastIdCalled = _id;
lastId = _id;
};
var tick = function () {
if (ticking && _lastIdCalled !== _id) {
nextCall();
requestAnimationFrame(tick);
} else {
end();
}
};
var start = function () {
ticking = true;
tick();
};
var end = function () {
ticking = false;
_this = _args = _id = _lastIdCalled = null;
};
return function () {
_this = this;
_args = arguments;
_id = Math.random();
if (!ticking) {
start();
}
};
};
var runInNumberFrames = function (fn, n) {
var count = 0;
var start = new Date();
var w = function () {
var delta = new Date() - start;
if (count != n) {
count++;
requestAnimationFrame(w);
} else {
fn();
}
}
w();
}
describe('framerate throttle', function () {
var fn;
var res = [];
beforeEach(function () {
fn = framerateThrottle(function (x) {
res.push(x);
});
res = [];
});
it('should run the first immediately and the last', function (done) {
for (var i of [1,2,3,4,5,6,7,8,9,10]) {
fn(i);
}
expect(res.length).toBe(1);
requestAnimationFrame(function () {
expect(res.length).toBe(2);
done();
});
});
it('should be called once per frame', function (done) {
fn(0); // called immediately
fn(1); // not be called since fn(2) supersedes it
fn(2); // called
expect(res.length).toBe(1);
runInNumberFrames(function () {
expect(res.length).toBe(2);
done();
}, 2);
expect(res.length).toBe(1);
});
it('should be called once per frame 2', function (done) {
fn(0); // called immediately
fn(1); // scheduled for next frame
runInNumberFrames(function () {
fn(2);
}, 1);
expect(res.length).toBe(1);
runInNumberFrames(function () {
expect(res.length).toBe(2);
}, 1);
runInNumberFrames(function () {
expect(res.length).toBe(3);
done();
}, 2);
expect(res.length).toBe(1);
});
})</script></body>
</html>
Raw
jsbin.jicajamohu.js
console.clear();
var framerateThrottle = function (f) {
var ticking = false;
var _this, _args, _id, _lastIdCalled;
var nextCall = function () {
f.apply(_this, _args);
_lastIdCalled = _id;
lastId = _id;
};
var tick = function () {
if (ticking && _lastIdCalled !== _id) {
nextCall();
requestAnimationFrame(tick);
} else {
end();
}
};
var start = function () {
ticking = true;
tick();
};
var end = function () {
ticking = false;
_this = _args = _id = _lastIdCalled = null;
};
return function () {
_this = this;
_args = arguments;
_id = Math.random();
if (!ticking) {
start();
}
};
};
var runInNumberFrames = function (fn, n) {
var count = 0;
var start = new Date();
var w = function () {
var delta = new Date() - start;
if (count != n) {
count++;
requestAnimationFrame(w);
} else {
fn();
}
}
w();
}
describe('framerate throttle', function () {
var fn;
var res = [];
beforeEach(function () {
fn = framerateThrottle(function (x) {
res.push(x);
});
res = [];
});
it('should run the first immediately and the last', function (done) {
for (var i of [1,2,3,4,5,6,7,8,9,10]) {
fn(i);
}
expect(res.length).toBe(1);
requestAnimationFrame(function () {
expect(res.length).toBe(2);
done();
});
});
it('should be called once per frame', function (done) {
fn(0); // called immediately
fn(1); // not be called since fn(2) supersedes it
fn(2); // called
expect(res.length).toBe(1);
runInNumberFrames(function () {
expect(res.length).toBe(2);
done();
}, 2);
expect(res.length).toBe(1);
});
it('should be called once per frame 2', function (done) {
fn(0); // called immediately
fn(1); // scheduled for next frame
runInNumberFrames(function () {
fn(2);
}, 1);
expect(res.length).toBe(1);
runInNumberFrames(function () {
expect(res.length).toBe(2);
}, 1);
runInNumberFrames(function () {
expect(res.length).toBe(3);
done();
}, 2);
expect(res.length).toBe(1);
});
})
@QuentinRoy
Copy link

What is the point of lastId line 25?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment