feat: benchmark using polyfil when wasm is not available

package-lock.json

@@ -8,7 +8,8 @@
       "name": "mcaptcha-survey",
       "version": "1.0.0",
       "dependencies": {
-        "@mcaptcha/pow-wasm": "0.1.0-alpha-1",
+        "@mcaptcha/pow_sha256-polyfill": "^0.1.0-alpha-1",
+        "@mcaptcha/pow-wasm": "^0.1.0-alpha-1",
         "@mcaptcha/vanilla-glue": "^0.1.0-alpha-3"
       },
       "devDependencies": {
@@ -18,7 +19,7 @@
         "@types/sinon": "^10.0.0",
         "@typescript-eslint/eslint-plugin": "^5.0.0",
         "@typescript-eslint/parser": "^5.0.0",
-        "@wasm-tool/wasm-pack-plugin": "^1.4.0",
+        "@wasm-tool/wasm-pack-plugin": "^1.6.0",
         "dart-sass": "^1.25.0",
         "eslint": "^8.0.1",
         "jest": "^27.2.5",
@@ -1439,6 +1440,29 @@
         }
       ]
     },
+    "node_modules/@mcaptcha/pow_sha256-polyfill": {
+      "version": "0.1.0-alpha-1",
+      "resolved": "https://registry.npmjs.org/@mcaptcha/pow_sha256-polyfill/-/pow_sha256-polyfill-0.1.0-alpha-1.tgz",
+      "integrity": "sha512-lnQNBCOnVI9BunHP8FGCsGs310GguQWdxSspXlvWcrLwgl86aq0hlBzZfOV+szG/jeTRAMry0He3MrD/kbqB/Q==",
+      "funding": [
+        {
+          "type": "individual",
+          "url": "http://mcaptcha.org/donate"
+        },
+        {
+          "type": "liberapay",
+          "url": "https://liberapay.com/mcaptcha"
+        },
+        {
+          "type": "individual",
+          "url": "http://batsense.net/donate"
+        },
+        {
+          "type": "liberapay",
+          "url": "https://liberapay.com/realaravinth"
+        }
+      ]
+    },
     "node_modules/@mcaptcha/pow-wasm": {
       "version": "0.1.0-alpha-1",
       "resolved": "https://registry.npmjs.org/@mcaptcha/pow-wasm/-/pow-wasm-0.1.0-alpha-1.tgz",
@@ -2919,9 +2943,9 @@
       }
     },
     "node_modules/caniuse-lite": {
-      "version": "1.0.30001447",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001447.tgz",
-      "integrity": "sha512-bdKU1BQDPeEXe9A39xJnGtY0uRq/z5osrnXUw0TcK+EYno45Y+U7QU9HhHEyzvMDffpYadFXi3idnSNkcwLkTw==",
+      "version": "1.0.30001448",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001448.tgz",
+      "integrity": "sha512-tq2YI+MJnooG96XpbTRYkBxLxklZPOdLmNIOdIhvf7SNJan6u5vCKum8iT7ZfCt70m1GPkuC7P3TtX6UuhupuA==",
       "dev": true,
       "funding": [
         {
@@ -11164,6 +11188,11 @@
       "resolved": "https://registry.npmjs.org/@mcaptcha/core-glue/-/core-glue-0.1.0-alpha-5.tgz",
       "integrity": "sha512-16qWm5O5X0Y9LXULULaAks8Vf9FNlUUBcR5KDt49aWhFhG5++JzxNmCwQM9EJSHNU7y0U+FdyAWcGmjfKlkRLA=="
     },
+    "@mcaptcha/pow_sha256-polyfill": {
+      "version": "0.1.0-alpha-1",
+      "resolved": "https://registry.npmjs.org/@mcaptcha/pow_sha256-polyfill/-/pow_sha256-polyfill-0.1.0-alpha-1.tgz",
+      "integrity": "sha512-lnQNBCOnVI9BunHP8FGCsGs310GguQWdxSspXlvWcrLwgl86aq0hlBzZfOV+szG/jeTRAMry0He3MrD/kbqB/Q=="
+    },
     "@mcaptcha/pow-wasm": {
       "version": "0.1.0-alpha-1",
       "resolved": "https://registry.npmjs.org/@mcaptcha/pow-wasm/-/pow-wasm-0.1.0-alpha-1.tgz",
@@ -12363,9 +12392,9 @@
       "dev": true
     },
     "caniuse-lite": {
-      "version": "1.0.30001447",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001447.tgz",
-      "integrity": "sha512-bdKU1BQDPeEXe9A39xJnGtY0uRq/z5osrnXUw0TcK+EYno45Y+U7QU9HhHEyzvMDffpYadFXi3idnSNkcwLkTw==",
+      "version": "1.0.30001448",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001448.tgz",
+      "integrity": "sha512-tq2YI+MJnooG96XpbTRYkBxLxklZPOdLmNIOdIhvf7SNJan6u5vCKum8iT7ZfCt70m1GPkuC7P3TtX6UuhupuA==",
       "dev": true
     },
     "chalk": {

package.json

@@ -16,7 +16,7 @@
     "@types/sinon": "^10.0.0",
     "@typescript-eslint/eslint-plugin": "^5.0.0",
     "@typescript-eslint/parser": "^5.0.0",
-    "@wasm-tool/wasm-pack-plugin": "^1.4.0",
+    "@wasm-tool/wasm-pack-plugin": "^1.6.0",
     "dart-sass": "^1.25.0",
     "eslint": "^8.0.1",
     "jest": "^27.2.5",
@@ -33,6 +33,7 @@
   },
   "dependencies": {
     "@mcaptcha/vanilla-glue": "^0.1.0-alpha-3",
-    "@mcaptcha/pow-wasm": "0.1.0-alpha-1"
+    "@mcaptcha/pow_sha256-polyfill": "^0.1.0-alpha-1",
+    "@mcaptcha/pow-wasm": "^0.1.0-alpha-1"
   }
 }

templates/bench/prove.ts

@@ -0,0 +1,60 @@
+/*
+ * mCaptcha is a PoW based DoS protection software.
+ * This is the frontend web component of the mCaptcha system
+ * Copyright © 2021 Aravinth Manivnanan <realaravinth@batsense.net>.
+ *
+ * Use of this source code is governed by Apache 2.0 or MIT license.
+ * You shoud have received a copy of MIT and Apache 2.0 along with
+ * this program. If not, see <https://spdx.org/licenses/MIT.html> for
+ * MIT or <http://www.apache.org/licenses/LICENSE-2.0> for Apache.
+ */
+
+import * as p from "@mcaptcha/pow_sha256-polyfill";
+import { PoWConfig } from "./types";
+
+/**
+ * proove work
+ * @param {PoWConfig} config - the proof-of-work configuration using which
+ * work needs to be computed
+ * */
+const prove = async (config: PoWConfig): Promise<number> => {
+  console.log(`Wasm support says ${WasmSupported}`);
+  let duration: number;
+  if (WasmSupported) {
+    const wasm = require("@mcaptcha/pow-wasm");
+    const t0 = performance.now();
+    wasm.gen_pow(config.salt, config.string, config.difficulty_factor);
+    const t1 = performance.now();
+    duration = t1 - t0;
+  } else {
+    console.log("WASM unsupported, expect delay during proof generation");
+    const t0 = performance.now();
+
+    await p.generate_work(config.salt, config.string, config.difficulty_factor);
+    const t1 = performance.now();
+    duration = t1 - t0;
+  }
+  return duration;
+};
+
+// credits: @jf-bastien on Stack Overflow
+// https://stackoverflow.com/questions/47879864/how-can-i-check-if-a-browser-supports-webassembly
+const WasmSupported = (() => {
+  try {
+    if (
+      typeof WebAssembly === "object" &&
+      typeof WebAssembly.instantiate === "function"
+    ) {
+      const module = new WebAssembly.Module(
+        Uint8Array.of(0x0, 0x61, 0x73, 0x6d, 0x01, 0x00, 0x00, 0x00)
+      );
+      if (module instanceof WebAssembly.Module)
+        return new WebAssembly.Instance(module) instanceof WebAssembly.Instance;
+    }
+  } catch (e) {
+    console.error(e);
+  }
+  return false;
+})();
+
+export default prove;

templates/bench/service-worker.ts

@@ -15,35 +15,24 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { gen_pow } from "@mcaptcha/pow-wasm";
-import { Bench } from "./types";
-
-type PoWConfig = {
-  string: string;
-  difficulty_factor: number;
-  salt: string;
-};
+import { Bench, PoWConfig } from "./types";
+import prove from "./prove";
 
 const SALT = "674243647f1c355da8607a8cdda05120d79ca5d1af8b3b49359d056a0a82";
 const PHRASE = "6e2a53dbc7d307970d7ba3c0000221722cb74f1c325137251ce8fa5c2240";
 
+console.debug("worker registered");
+
+onmessage = async (event) => {
+  console.debug("message received at worker");
+  const difficulty_factor = parseInt(event.data);
   const config: PoWConfig = {
     string: PHRASE,
-  difficulty_factor: 1,
+    difficulty_factor,
     salt: SALT,
   };
 
-console.debug("worker registered");
-
-onmessage = function (event) {
-  console.debug("message received at worker");
-  const difficulty_factor = parseInt(event.data);
-  config.difficulty_factor = difficulty_factor;
-
-  const t0 = performance.now();
-  gen_pow(config.salt, config.string, config.difficulty_factor);
-  const t1 = performance.now();
-  const duration = t1 - t0;
+  let duration = await prove(config);
 
   const msg: Bench = {
     difficulty: difficulty_factor,

templates/bench/types.ts

@@ -35,3 +35,9 @@ export type SubmissionProof = {
 export type BenchConfig = {
   difficulties: Array<number>;
 };
+
+export type PoWConfig = {
+  string: string;
+  difficulty_factor: number;
+  salt: string;
+};

webpack.config.js

@@ -1,30 +1,30 @@
-'use strict';
-const path = require('path');
+"use strict";
+const path = require("path");
 //const WasmPackPlugin = require('@wasm-tool/wasm-pack-plugin');
 
 module.exports = {
-  devtool: 'inline-source-map',
-  mode: 'development',
+  devtool: "inline-source-map",
+  mode: "production",
   //mode: 'production',
   entry: {
-    bundle: './templates/index.ts',
-    bench: './templates/bench/service-worker.ts',
-    glue: './templates/bench/vendor.ts',
+    bundle: "./templates/index.ts",
+    bench: "./templates/bench/service-worker.ts",
+    glue: "./templates/bench/vendor.ts",
   },
   output: {
-    filename: '[name].js',
-    path: path.resolve(__dirname, './static/cache/bundle'),
+    filename: "[name].js",
+    path: path.resolve(__dirname, "./static/cache/bundle"),
   },
   module: {
     rules: [
       {
         test: /\.tsx?$/,
-        loader: 'ts-loader',
+        loader: "ts-loader",
       },
     ],
   },
   resolve: {
-    extensions: ['.ts', '.tsx', '.js'],
+    extensions: [".ts", ".tsx", ".js"],
   },
 
   experiments: {