title: Run JS function and WASM module concurrently
body: <p>I am trying to create some sort of a benchmark app that would concurrently run WASM module and its' equivalent JS function and then compare execution time of those two. I have tried using promises, callbacks, and the example from MDN with using <code>await Promise.all(arrayOfPromises)</code>, but in each case JS function starts running after the WASM module is done.</p>
  <p>Code is down below, ignore the DOM boilerplate:</p>
  <pre><code>import { default as wasm } from &quot;./pkg/hello_world.js&quot;
  import { sortRandomArray } from &quot;./src/sorting.js&quot;
  
  window.onload = () =&gt; {
      const btn = document.getElementById(&quot;inputConfirmation&quot;);
      addListeners(Array(btn), runTestAndPrintResult);
  }
  
  async function runWasmModule(sortRandomArray, arraySize) {
      return new Promise(() =&gt; {
          const time = parseFloat(sortRandomArray(arraySize));
          console.log('wasm done ' + time);
      });
  }
  
  async function runJSAlgo(sortRandomArray, arraySize) {
      return new Promise(() =&gt; {
          const time = sortRandomArray(arraySize) / 1000;
          console.log('js done ' + time);
      });
  }
  
  function addListeners(elements, fun) {
      for (const element of elements) {
          element.addEventListener(&quot;click&quot;, fun);
      }
  
      document.addEventListener(&quot;keypress&quot;, event =&gt; {
          if (event.key === &quot;Enter&quot;) {
              fun();
          }
      })
  }
  
  const runTestAndPrintResult = async () =&gt; {
      let arraySize = document.getElementById(&quot;arraySizeInput&quot;).value;
      if (arraySize === &quot;&quot;) {
          return;
      }
  
      arraySize = parseInt(arraySize);
      const n = document.createElement(&quot;h1&quot;);
  
      if (arraySize &lt;= 1) {
          n.textContent = &quot;Nice try :)&quot;;
          document.body.appendChild(n);
          return;
      }
  
      const wasmInstance = wasm();
      wasmInstance.then(async (module) =&gt; {
          await Promise.all([
              runWasmModule(module.sort_random_array, arraySize),
              runJSAlgo(sortRandomArray, arraySize),
          ]);
      }).catch(err =&gt; {
          console.error(err);
      })
  }
  
  </code></pre>
  <p>I do understand that JS is a single-threaded language but I got confused with all of the terms online about asynchronous nature. If there is no way to do this in JS, is there anything else I could try in order to  realize this?</p>