Published
Edited
Mar 7, 2020
5 stars
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
arrowFilterStats = {
const t1 = performance.now();
const count = policiesTable.filter(
arrow.predicate.and(
arrow.predicate.col('proto').eq(6),
arrow.predicate.or(
arrow.predicate.and(
arrow.predicate.col('startPort').gt(0),
arrow.predicate.col('endPort').lt(200)
),
arrow.predicate.col('startPort').eq(49152)
),
arrow.predicate.col('isActive').eq(true)
)
).count();
const t2 = performance.now();
return {
count,
ms: t2 - t1
};
}
Insert cell
gpuFilterStats = {
let count = 0;
const gpu = new GPU.GPU({ mode: 'webgl2' });
const predicate = gpu.createKernel(function(proto, startPort, endPort, isActive) {
if (
proto[this.thread.x] === 6 &&
(startPort[this.thread.x] > 0 && endPort[this.thread.x] < 200 || startPort[this.thread.x] === 49152) &&
isActive[this.thread.x] === 1
) {
return 1;
}
return 0;
})
.setOutput([policies.length])
.setPipeline(true);
const toTexture = gpu.createKernel(function(array) { return array[this.thread.x]; }, { output: [policies.length], pipeline: true });
const protosTexture = toTexture(protos);
const startPortsTexture = toTexture(startPorts);
const endPortsTexture = toTexture(endPorts);
const isActivesTexture = toTexture(isActives);
predicate.build(protosTexture, startPortsTexture, endPortsTexture, isActivesTexture);
const forceSync = gpu.createKernel(function() { return 1; }, { output: [1] });
forceSync.build();
const t1 = performance.now();
const result = predicate(protosTexture, startPortsTexture, endPortsTexture, isActivesTexture);
forceSync();
const t2 = performance.now();
return {
result: result,
count: d3.sum(result.toArray()),
ms: t2 - t1
};
}
Insert cell
arrayFilterStats = {
const predicate = policy => {
return policy.proto === 6
&& ((policy.startPort > 0 && policy.endPort < 200) || policy.startPort === 49152)
&& policy.isActive === true;
};
const t1 = performance.now();
const count = policies.filter(predicate).length;
const t2 = performance.now();
return {
count,
ms: t2 - t1
};
}
Insert cell
lodashFilterStats = {
const predicate = policy => {
return policy.proto === 6
&& ((policy.startPort > 0 && policy.endPort < 200) || policy.startPort === 49152)
&& policy.isActive === true;
};
const t1 = performance.now();
const count = _(policies).filter(predicate).value().length;
const t2 = performance.now();
return {
count,
ms: t2 - t1
};
}
Insert cell
Insert cell
winningTime = Math.min(lodashFilterStats.ms, arrayFilterStats.ms, arrowFilterStats.ms, gpuFilterStats.ms);
Insert cell
xFactor = (value) => {
if(value === winningTime) return '🏆'
else{
const multiple = value/winningTime;
return multiple.toFixed(1) + 'x';
}
}
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
_ = require("lodash@4");
Insert cell
Insert cell
GPU = require("gpu.js@2")
Insert cell
import {slider} from "@jashkenas/inputs"
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more