Skip to content

Instantly share code, notes, and snippets.

@Rob-ot

Rob-ot/test.html

Created March 29, 2011 05:03
Show Gist options
  • Save Rob-ot/891836 to your computer and use it in GitHub Desktop.
Save Rob-ot/891836 to your computer and use it in GitHub Desktop.
Download ZIP
A nice little wrapper for web workers, I will be hacking on this more because I plan on using it for a game. Live version (for now) http://middlerob.com/tasky/ dont forget to open console
Raw
test.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Tasky</title>
<style>
</style>
</head>
<body>
<script>
var tasky = (function () {
var cbs = []
function sender (name, worker) {
return function () {
var args = Array.prototype.slice.call(arguments),
id
cbs.push(args.pop())
id = cbs.length - 1
worker.postMessage({"method":name, "id":id, "arguments":args})
}
}
return function (workerUrl, onReady) {
var worker = new Worker(workerUrl),
exports = {}
worker.onmessage = function (e) {
var data = e.data
if (data.type === "declare") {
for (var i = 0; i < data.data.length; i++) {
exports[data.data[i]] = sender(data.data[i], worker)
}
onReady(exports)
}
else if (data.type === "response") {
cbs[data.id].apply(null, data.arguments)
// delete id eventually or something
}
else if (data.type === "log") {
if (window.console) {
console.log.apply(null, data.data)
}
}
else {
window.console && window.console.log("Unhandled message", e.data)
}
}
worker.onerror = function (e) {
console.log("onerror", e.message)
}
}
}())
// main thread interface
tasky("testWorker.js", function (mather) {
mather.add(5, 6, function (err, result) {
console.log("got a response!", result === 11)
})
mather.add(4, 3, function (err, result) {
console.log("got a response!", result === 7)
})
mather.add(9, 30, function (err, result) {
console.log("got a response!", result === 39)
})
mather.add(80, 9, function (err, result) {
console.log("got a response!", result === 89)
})
mather.add(37, 3, function (err, result) {
console.log("got a response!", result === 40)
})
mather.multiply(5, 4, function (err, result) {
console.log("got a response!", result === 20)
})
var start = new Date().getTime()
function iterate (i, limit) {
mather.callback(i, function (err, i) {
if (i < limit) {
iterate(++i, limit)
}
else {
console.log((new Date().getTime() - start) / limit)
}
})
}
iterate(0, 5000)
})
</script>
</body>
</html>
Raw
testWorker.js
(function (run) {
var methodNames = [],
methods = {},
console = {
log: function () {
postMessage({"type":"log", "data":Array.prototype.slice.call(arguments)})
}
}
run(methods, console)
for (var methodName in methods) {
methodNames.push(methodName)
}
postMessage({"type":"declare", "data":methodNames})
onmessage = function (e) {
var data = e.data
// assign callback
data.arguments.push(function (err, arg) {
postMessage({"type":"response", "id":data.id, "arguments":[err, arg]})
})
// run
if (methods[data.method]) {
methods[data.method].apply(null, data.arguments)
}
}
// worker interface
}(function (exports, console) {
exports.add = function (a, b, cb) {
setTimeout(function () {
cb(null, a + b)
}, 1000)
}
exports.multiply = function (a, b, cb) {
cb(null, a * b)
}
exports.callback = function (data, cb) {
cb(null, data)
}
}))
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment