utilise Web Worker whenever available

fixes #675

diff --git a/Gruntfile.js b/Gruntfile.js
index d5f0c42..07b36d6 100644 (file)
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -50,7 +50,7 @@ module.exports = function(grunt) {
         src: ['tests/*.js', 'test.js']
       },
       web: {
-        src: 'assets/master.js'
+        src: ['assets/master.js', 'assets/worker.js']
       },
       other: {
         src: ['backtest.js', 'benchmark.js']

diff --git a/assets/.eslintrc.json b/assets/.eslintrc.json
index 2805cce..c11cf02 100644 (file)
--- a/assets/.eslintrc.json
+++ b/assets/.eslintrc.json
@@ -1,6 +1,7 @@
 {
   "env": {
-    "browser": true
+    "browser": true,
+    "worker": true
   },
   "rules": {
     "strict": [

diff --git a/assets/master.js b/assets/master.js
index c54d907..8013de7 100644 (file)
--- a/assets/master.js
+++ b/assets/master.js
@@ -1,7 +1,31 @@
 (function() {
   'use strict';
 
-  var minify = require('html-minifier').minify;
+  var minify = (function() {
+    var minify = require('html-minifier').minify;
+    return function(value, options, callback, errorback) {
+      var minified;
+      try {
+        minified = minify(value, options);
+      }
+      catch (err) {
+        return errorback(err);
+      }
+      callback(minified);
+    };
+  })();
+  var worker = new Worker('worker.js');
+  worker.onmessage = function() {
+    minify = function(value, options, callback, errorback) {
+      postMessage({
+        value: value,
+        options: options
+      });
+      worker.onmessage = function(event) {
+        (typeof event.data === 'string' ? callback : errorback)(event.data);
+      };
+    };
+  };
 
   function byId(id) {
     return document.getElementById(id);
@@ -53,12 +77,11 @@
   }
 
   byId('minify-btn').onclick = function() {
-    try {
-      var options = getOptions(),
-          originalValue = byId('input').value,
-          minifiedValue = minify(originalValue, options),
-          diff = originalValue.length - minifiedValue.length,
-          savings = originalValue.length ? (100 * diff / originalValue.length).toFixed(2) : 0;
+    byId('minify-btn').disabled = true;
+    var originalValue = byId('input').value;
+    minify(originalValue, getOptions(), function(minifiedValue) {
+      var diff = originalValue.length - minifiedValue.length;
+      var savings = originalValue.length ? (100 * diff / originalValue.length).toFixed(2) : 0;
 
       byId('output').value = minifiedValue;
 
@@ -68,11 +91,12 @@
           '. Minified size: <strong>' + commify(minifiedValue.length) + '</strong>' +
           '. Savings: <strong>' + commify(diff) + ' (' + savings + '%)</strong>.' +
         '</span>';
-    }
-    catch (err) {
+      byId('minify-btn').disabled = false;
+    }, function(err) {
       byId('output').value = '';
       byId('stats').innerHTML = '<span class="failure">' + escapeHTML(err) + '</span>';
-    }
+      byId('minify-btn').disabled = false;
+    });
   };
 
   byId('select-all').onclick = function() {

diff --git a/assets/worker.js b/assets/worker.js
new file mode 100644 (file)
index 0000000..bb5e1fe
--- /dev/null
+++ b/assets/worker.js
@@ -0,0 +1,15 @@
+(function() {
+  'use strict';
+
+  importScripts('../dist/htmlminifier.min.js');
+  var minify = require('html-minifier').minify;
+  addEventListener('message', function(event) {
+    try {
+      postMessage(minify(event.data.value, event.data.options));
+    }
+    catch (err) {
+      postMessage(err);
+    }
+  });
+  postMessage(null);
+})();