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

  • Select an option

    Learn more about clone URLs
  • Save ptbrowne/cfe8318854b72ec1c9e62935a76ce54f to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
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
Copy Markdown

QuentinRoy commented Feb 16, 2017

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