Webworker (#3480)

* added missing eslint-loader that prevented the example to run and changed freeWorker to terminate a worker and create a new since we can not really free a worker

* proper remove long running worker from longRunningWorkers array when done

* polish web-worker example

set nuxt to 'latest' version

this will change

this will also change

examples/web-worker/assets/js/Example.worker.js

@@ -1,4 +1,4 @@
-// // block for `time` ms, then return the number of loops we could run in that time:
+// block for `time` ms, then return the number of loops we could run in that time:
 function expensive(time) {
 	let start = Date.now(),
 		  count = 0
@@ -13,5 +13,7 @@ self.addEventListener('message', (event) => {
   if (event.data.action === 'expensive' && event.data.time) {
 		// Post data to parent thread
 		self.postMessage(expensive(Number(event.data.time)))
+	} else {
+		self.postMessage({ hello: 'from worker' })
 	}
 })

examples/web-worker/package.json

@@ -11,9 +11,10 @@
     "precommit": "npm run lint"
   },
   "dependencies": {
-    "nuxt": "^1.4.0"
+    "nuxt": "^1.4.1"
   },
   "devDependencies": {
+    "eslint-loader": "^2.0.0",
     "worker-loader": "^1.1.1"
   }
 }

examples/web-worker/pages/index.vue

@@ -68,6 +68,12 @@ export default {
     test () {
       const worker = this.workers[this.workerIndex++ % this.workers.length]
 
+      if (worker) {
+        worker.onmessage = (event) => {
+          this.notification = event.data.hello
+        }
+      }
+
       if (worker) worker.postMessage({ hello: 'world' })
       else this.notification = 'No more test workers available'
     },
@@ -76,7 +82,9 @@ export default {
 
       if (worker) {
         worker.onmessage = (event) => {
-          console.log(`expensive made ${event.data} loops`)
+          this.notification = `expensive made ${event.data} loops`
+          worker.onmessage = null
+          this.workers.push(...this.longRunningWorkers.splice(this.longRunningWorkers.indexOf(worker), 1))
         }
         this.longRunningWorkers.push(worker)
       } else {
@@ -86,9 +94,11 @@ export default {
       worker.postMessage({ action: 'expensive', time: miliseconds })
     },
     freeWorker () {
+      // we can't really free a worker, we can only terminate it and create a new
       const worker = this.longRunningWorkers.pop()
       worker.onmessage = null
-      this.workers.push(worker)
+      worker.terminate()
+      this.workers.push(this.$worker.createWorker())
       this.notification = 'Worker freed'
     },
     removeWorker () {