Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Star 4 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save billmalarky/1d1f72a267a1608606410602aa63cabf to your computer and use it in GitHub Desktop.
Save billmalarky/1d1f72a267a1608606410602aa63cabf to your computer and use it in GitHub Desktop.
React Native Queue integration with react-native-workers
// https://github.com/billmalarky/react-native-queue
// https://github.com/devfd/react-native-workers
// ######################
// From your application:
// ######################
import queueFactory from 'react-native-queue';
import { Worker } from 'react-native-workers';
// Initialize queue and throw a few jobs on it
const queue = await queueFactory();
// TECHNICALLY, we don't have to register worker handler functions on the queue
// in order to start creating jobs. This is because in this example we only run the
// queue in the worker.js thread. Still, typically you should always register the
// react native queue worker handlers associated with each job name before
// using queue.createJob() just as good practice (unless you want to fail fast
// if queue accidentally starts processing in UI thread, which would happen if you forget
// to pass FALSE to createJob()).
queue.createJob('arbitrary-job-name', {data: 'this is some data'}, {}, false); // IMPORTANT! Pass false or queue will start up immediately in your UI thread.
queue.createJob('arbitrary-job-name', {data: 'this is different data'}, {}, false);
queue.createJob('a-different-job', {name: 'Kylo Ren'}, {}, false);
queue.createJob('a-different-job', {name: 'Rey'}, {}, false);
/* start worker */
const worker = new Worker("path/to/worker.js");
/* post message to worker. String only ! */
worker.postMessage("start up the queue yo!");
/* get message from worker. String only ! */
worker.onmessage = (message) => {
console.log(message); // should print "queue finished my dude!"
worker.terminate();
}
// ######################
// From your worker.js file:
// ######################
import { self } from 'react-native-workers';
/* get message from application. String only ! */
self.onmessage = (message) => {
console.log(message); // Pointless for this example, but should print "start up the queue yo!"
// Init queue
queue = queueFactory()
.then(() => {
// Register react-native-query workers. Bit of naming overlap here which is unfortunately a bit confusing, but this is
// not of course a "react native worker" but is rather the handler function that will be called when the queue begins
// processing the "arbitrary-job-name" job.
queue.addWorker('arbitrary-job-name', async (id, payload) => {
// Do arbitrary stuff here, but not in your UI thread!
await new Promise((resolve) => {
console.log('starting some "work" that will take 3 seconds!');
console.log(payload, 'payload');
setTimeout(() => {
console.log('yea, "work" completed.');
resolve();
}, 3000);
})
});
queue.addWorker('a-different-job', async (id, payload) => {
// Do "different" arbitrary stuff here, but not in your UI thread!
console.log('work work work work work');
console.log(payload, 'payload');
});
queue.start()
.then(() => {
self.postMessage('queue finished my dude!');
});
});
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment