Skip to content

Instantly share code, notes, and snippets.

@zbjornson
Last active August 11, 2016 19:25
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 zbjornson/5624778 to your computer and use it in GitHub Desktop.
Save zbjornson/5624778 to your computer and use it in GitHub Desktop.
First attempt at hand-writing an asm.js module.
// Interpolates through 10 RGB values, given a value and its domain
colorGradientCalculator = function (stdlib, foreign, heap) {
"use asm";
var rgb = new stdlib.Uint8Array(heap);
var imul = stdlib.Math.imul;
var floor = stdlib.Math.floor;
var lowIndex = 0;
var partial = 0.0;
var min = 0.0;
var max = 0.0;
function init(imin, imax) {
imin = +imin;
imax = +imax;
min = imin;
max = imax;
// Red
rgb[0] = 50;
rgb[1] = 75;
rgb[2] = 102;
rgb[3] = 150;
rgb[4] = 204;
rgb[5] = 255;
rgb[6] = 255;
rgb[7] = 255;
rgb[8] = 255;
rgb[9] = 255;
// Green
rgb[10] = 0;
rgb[11] = 0;
rgb[12] = 0;
rgb[13] = 0;
rgb[14] = 0;
rgb[15] = 67;
rgb[16] = 186;
rgb[17] = 217;
rgb[18] = 255;
rgb[19] = 255;
// Blue
rgb[20] = 80;
rgb[21] = 80;
rgb[22] = 0;
rgb[23] = 0;
rgb[24] = 0;
rgb[25] = 0;
rgb[26] = 51;
rgb[27] = 51;
rgb[28] = 51;
rgb[29] = 150;
}
// Caclulate the floor and decimal part of the value
function set(x) {
x = +x;
var a = 0.0, b = 0.0, c = 0.0, d = 0.0, e = 0.0;
a = x - min;
b = 10.0 * a;
c = max - min;
d = b / c;
e = floor(d);
lowIndex = ~~e;
partial = +(d - e);
return;
}
function getR() {
var i = 0, v = 0, a = 0, h = 0, d = 0, z = 0, x = 0, t = 0;
i = lowIndex|0;
v = rgb[lowIndex]|0;
a = (lowIndex + 1)|0;
h = rgb[a]|0;
d = (h - v)|0;
x = ~~floor(partial * 1000.0);
z = imul(d, x);
t = ((z|0)/(1000|0))|0;
v = (v + t)|0;
return v|0;
}
function getG() {
var i = 0, v = 0, a = 0, h = 0, d = 0, z = 0, x = 0, t = 0;
i = (lowIndex + 10)|0;
v = rgb[i]|0;
a = (i + 1)|0;
h = rgb[a]|0;
d = (h - v)|0;
x = ~~floor(partial * 1000.0);
z = imul(d, x);
t = ((z|0)/(1000|0))|0;
v = (v + t)|0;
return v|0;
}
function getB() {
var i = 0, v = 0, a = 0, h = 0, d = 0, z = 0, x = 0, t = 0;
i = (lowIndex + 20)|0;
v = rgb[i]|0;
a = (i + 1)|0;
h = rgb[a]|0;
d = (h - v)|0;
x = ~~floor(partial * 1000.0);
z = imul(d, x);
t = ((z|0)/(1000|0))|0;
v = (v + t)|0;
return v|0;
}
return {
init: init,
set: set,
getR: getR,
getG: getG,
getB: getB
};
}
// In actual usage, each iteration draws a point of the calculated color (arg to .set is not i).
// Slowdown seems to come with bigger loops; upper bound of 10k instead of 100k is faster with asm.js.
colorGradient = colorGradientCalculator(window, null, new ArrayBuffer(4096));
colorGradient.init(1,10);
console.time("calc");
for (var i = 0; i < 100000; i++) { colorGradient.set(i); colorGradient.getR(); colorGradient.getG(); colorGradient.getB(); };
console.timeEnd("calc");
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment