feat: impl benchmark & do some optimizations

pkgs/benchmark/package.json

@@ -24,7 +24,6 @@
 		"typescript": "~5.8.3",
 		"typescript-eslint": "^8.35.1",
 		"vite": "^7.0.4",
-		"@pow-captcha/solver-wasm": "workspace:*",
 		"@pow-captcha/pow-captcha": "workspace:*"
 	}
 }

pkgs/benchmark/src/App.tsx

@@ -1,5 +1,84 @@
-import "./App.css";
+// import * as wasm from "@pow-captcha/solver-wasm";
+import * as powCaptcha from "@pow-captcha/pow-captcha";
+import { useEffect, useRef, useState } from "react";
+
+async function benchmark(cb: () => void | Promise<void>): Promise<number> {
+	const start = performance.now();
+	await cb();
+	const end = performance.now();
+	return end - start;
+}
 
 export default function App() {
-	return <div>My Benchmark</div>;
+	const [durationJs, setDurationJs] = useState<null | number>(null);
+	const [durationWasm, setDurationWasm] = useState<null | number>(null);
+
+	const [runBenchmark, setRunBenchmark] = useState(false);
+
+	const initStartedRef = useRef(false);
+
+	useEffect(() => {
+		if (!runBenchmark || initStartedRef.current) {
+			return;
+		}
+
+		initStartedRef.current = true;
+
+		async function init() {
+			const challengesRaw = await powCaptcha.server.createChallengesRaw({
+				difficulty: 2,
+				challengeCount: 64,
+			});
+
+			const challenges = challengesRaw.challenges.map(
+				(challenge) =>
+					[
+						powCaptcha.wire.deserializeArray(challenge[0]),
+						powCaptcha.wire.deserializeArray(challenge[1]),
+					] as const,
+			);
+
+			const durationWasm = await benchmark(async () => {
+				const solutions = await powCaptcha.solver.solveChallenges(
+					challenges,
+					"wasm",
+				);
+				console.log("wasm solutions", solutions);
+			});
+			setDurationWasm(durationWasm);
+
+			// const durationJs = await benchmark(async () => {
+			// 	const solutions = await powCaptcha.solver.solveChallenges(
+			// 		challenges,
+			// 		"js",
+			// 	);
+			// 	console.log("js solutions", solutions);
+			// });
+			// setDurationJs(durationJs);
+		}
+
+		init();
+	}, [runBenchmark]);
+
+	return (
+		<div>
+			<h1>pow-captcha Benchmark</h1>
+			<button onClick={() => setRunBenchmark(true)}>run</button>
+			Results:
+			<table>
+				<tr>
+					<th>type</th>
+					<th>duration</th>
+				</tr>
+				<tr>
+					<td>wasm</td>
+					<td>{durationWasm}ms</td>
+				</tr>
+				<tr>
+					<td>js</td>
+					<td>{durationJs}ms</td>
+				</tr>
+			</table>
+		</div>
+	);
 }

pkgs/benchmark/vite.config.ts

@@ -1,9 +1,15 @@
-import { defineConfig } from "vite";
+import { defineConfig, type PluginOption } from "vite";
 import react from "@vitejs/plugin-react";
 import wasm from "vite-plugin-wasm";
 import topLevelAwait from "vite-plugin-top-level-await";
 
+const plugins: Array<PluginOption> = [react(), wasm(), topLevelAwait()];
+
 // https://vite.dev/config/
 export default defineConfig({
-	plugins: [react(), wasm(), topLevelAwait()],
+	plugins,
+	worker: {
+		format: "es",
+		plugins: () => plugins,
+	},
 });