webworker demo

spencermountain · Nov 28, 2019 · dcc626c · dcc626c
1 parent 6b1727c
commit dcc626c
Show file tree

Hide file tree

Showing 2 changed files with 109 additions and 0 deletions.
diff --git a/demo/_worker.js b/demo/_worker.js
@@ -0,0 +1,12 @@
+//loads and runs compromise inside the worker-instance
+self.addEventListener(
+  'message',
+  function(e) {
+    // importScripts('https://unpkg.com/compromise@next')
+    importScripts('../builds/compromise.js')
+    let doc = self.nlp(e.data)
+    let m = doc.places()
+    self.postMessage(m.json({ count: true, unique: true }))
+  },
+  false
+)
diff --git a/demo/webworker.html b/demo/webworker.html
@@ -0,0 +1,97 @@
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <style>
+      .desc {
+        font-size: 18px;
+        margin-left: 20%;
+        margin-right: 20%;
+        color: grey;
+        margin-top: 25px;
+        margin-bottom: 25px;
+      }
+      table {
+        margin-top: 25px;
+        font-size: 25px;
+        color: steelblue;
+      }
+      #result {
+        font-size: 32px;
+        margin-left: 20%;
+        margin-right: 20%;
+        background-color: #fdfdff;
+      }
+      textarea {
+        width: 400px;
+        height: 300px;
+        margin-left: 20%;
+        margin-right: 20%;
+        margin-top: 10px;
+        margin-bottom: 10px;
+        padding: 20px;
+        font-size: 15px;
+      }
+    </style>
+  </head>
+  <script>
+    //create the worker
+    var worker = new Worker('./_worker.js')
+    //respond to it finishing
+    worker.addEventListener(
+      'message',
+      function(r) {
+        console.log(r)
+        let rows = r.data.map(o => {
+          return `<tr><td>${o.reduced}</td><td>${o.count}</td></tr>`
+        })
+        document.getElementById('result').innerHTML = '<table>' + rows.join('') + '</table>'
+      },
+      false
+    )
+
+    window.onload = function() {
+      //send it some text
+      let str = document.getElementById('text').value
+      worker.postMessage(str)
+    }
+  </script>
+  <body>
+    <div class="desc">
+      It's sometimes clever to run <a href="https://github.com/nlp-compromise/compromise">compromise</a> in a
+      <a href="https://www.html5rocks.com/en/tutorials/workers/basics/">webworker</a>.
+      <p></p>
+      <div>
+        This way you can keep the synchronous operations off the main-thread,
+        <br />
+        <ul>
+          and run multiple tasks (potentially) in parallel.
+        </ul>
+      </div>
+    </div>
+    <textarea id="text">
+Now this is a story all about how my life got flipped-turned upside down.
+and I'd like to take a minute, just sit right there, I'll tell you how I became the prince of a town called Bel-Air.
+In west Philadelphia born and raised, on the playground was where I spent most of my days.
+Chillin' out maxin' relaxin' all cool, and all shooting some b-ball outside of the school.
+When a couple of guys who were up to no good started making trouble in my neighborhood,
+I got in one little fight and my mom got scared, she said, "You're movin' with your auntie and uncle in Bel-Air".
+I begged and pleaded with her day after day but she packed my suitcase and sent me on my way.
+She gave me a kiss and then she gave me my ticket. I put my Walkman on and said, "I might as well kick it".
+First class, yo, this is bad. Drinking orange juice out of a champagne glass.
+Is this what the people of Bel-Air living like? Hmm, this might be alright.
+But wait I hear they're prissy, bourgeois, all that. Is this the type of place that they just send this cool cat?
+I don't think so, I'll see when I get there.
+I hope they're prepared for the prince of Bel-Air.
+Well, the plane landed and when I came out. There was a dude who looked like a cop standing there with my name out.
+I ain't trying to get arrested yet, I just got here.
+I sprang with the quickness like lightning, disappeared.
+I whistled for a cab and when it came near. The license plate said "Fresh" and it had dice in the mirror.
+If anything I could say that this cab was rare, but I thought, "Nah, forget it" – "Yo, home to Bel-Air"!
+I pulled up to the house about 7 or 8 and I yelled to the cabbie, "Yo home smell ya later".
+I looked at my kingdom, I was finally there. To sit on my throne as the Prince of Bel-Air.
+      </textarea
+    >
+    <div class="desc">worker output:</div>
+    <div id="result"></div>
+  </body>
+</html>