├── .gitattributes
├── .gitignore
├── LICENSE
├── README.md
├── bower.json
├── example
├── config.js
├── counting.js
└── main.js
├── gruntfile.js
├── index.html
├── package.json
└── src
├── worker-fake.js
└── worker.js
/.gitattributes:
--------------------------------------------------------------------------------
1 | # Auto detect text files and perform LF normalization
2 | * text=auto
3 |
4 | *.html text diff=html
5 | *.css text
6 | *.less text
7 | *.js text
8 | *.md text
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | /bower_components
2 | /node_modules
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | The MIT License (MIT)
2 |
3 | Copyright (c) 2013 Chad Lee
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy of
6 | this software and associated documentation files (the "Software"), to deal in
7 | the Software without restriction, including without limitation the rights to
8 | use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
9 | the Software, and to permit persons to whom the Software is furnished to do so,
10 | subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
17 | FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
18 | COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
19 | IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
20 | CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
21 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # Using Web Workers with RequireJS
2 |
3 | This is a simple plugin that allows you to declare a dependency on a web worker script using requireJS with a simple syntax. See here for [primer on Web Workers](https://developer.mozilla.org/en-US/docs/DOM/Using_web_workers).
4 |
5 | ```javascript
6 | define(["worker!my-web-worker"], function(worker) {
7 | worker.onmessage = function (event) {
8 | alert("I got me a message!");
9 | };
10 | });
11 | ```
12 |
13 | The plugin will return an initialized `Worker` object which will resolve the given module ID with the currently configured requireJS configuration (no need to hardcode script paths just for web workers).
14 |
15 | If Worker is not defined (IE < 10), the plugin will load a [fake Worker implementation](http://code.google.com/p/fakeworker-js/) so that your scripts can utilize the same Worker API whether the browser supports it or not.
16 |
17 | ## Install with [Bower](http://bower.io/)
18 |
19 | ```
20 | bower install requirejs-web-workers
21 | ```
22 |
23 | Then add `src/worker.js` and `src/worker-fake.js` to your project.
24 |
25 | ## How to Run Example Page
26 |
27 | The example page just loops and counts to a very large number on a background thread. In order to run the example, you will need to run index.html from a server (e.g. `localhost`) rather than the `file://` protocol for web workers to work.
28 |
29 | To run the example with a lightweight node server, first install dependencies:
30 |
31 | ```
32 | npm install
33 | ```
34 |
35 | Make sure you have grunt-cli installed if you don't already have it:
36 |
37 | ```
38 | npm install grunt-cli -g
39 | ```
40 |
41 | Then, run the server and load the example page:
42 |
43 | ```
44 | npm start
45 | ```
46 |
47 | This will spin up a server at `localhost:1337` and open your web browser.
48 |
--------------------------------------------------------------------------------
/bower.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "requirejs-web-workers",
3 | "version": "1.0.1",
4 | "main": "src/worker.js",
5 | "ignore": [
6 | "node_modules",
7 | "bower_components"
8 | ]
9 | }
10 |
--------------------------------------------------------------------------------
/example/config.js:
--------------------------------------------------------------------------------
1 | var require = (function (window) {
2 | return {
3 | //by default load modules from src
4 | baseUrl: "/src",
5 | paths: {
6 | //except if the module ID starts with "app"
7 | app: "../example",
8 |
9 | //CDN
10 | "jquery": "//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min"
11 | }
12 | };
13 | })(this);
--------------------------------------------------------------------------------
/example/counting.js:
--------------------------------------------------------------------------------
1 | //note: can also use requireJS in this file - see here for more info: http://requirejs.org/docs/api.html#webworker
2 |
3 | onmessage = function (event) {
4 | if (event.data == "start") {
5 | count();
6 | }
7 | }
8 |
9 | function count() {
10 | var end = 1e8, tmp = 1;
11 | postMessage("hello there");
12 | while (end) {
13 | end -= 1;
14 | tmp += end;
15 | if (end === 5e7) { // 5e7 is the half of 1e8
16 | postMessage("halfway there, tmp is now " + tmp);
17 | }
18 | }
19 | postMessage("all done");
20 | }
--------------------------------------------------------------------------------
/example/main.js:
--------------------------------------------------------------------------------
1 | define(["jquery", "worker!app/counting"], function ($, counter) {
2 | counter.onmessage = function (event) {
3 | $("#results").append("
message from the background thread: " + event.data + "