Deploy demo to GitHub Pages with refine/heuristic controls

.github/workflows/pages.yml

@@ -0,0 +1,38 @@
+name: Deploy demo
+
+on:
+  push:
+    branches: [master]
+  workflow_dispatch:
+
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+concurrency:
+  group: pages
+  cancel-in-progress: true
+
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 24
+      - run: npm ci
+      - run: npm run build
+      - run: cp dist/string-diff.min.js demo/
+      - uses: actions/configure-pages@v5
+        with:
+          enablement: true
+      - uses: actions/upload-pages-artifact@v3
+        with:
+          path: demo
+      - id: deployment
+        uses: actions/deploy-pages@v4

.gitignore

@@ -1,5 +1,6 @@
 node_modules/
 dist/
+demo/string-diff.min.js
 *.tsbuildinfo
 
 ### Docs ###

README.md

@@ -11,7 +11,7 @@
 
 Fast **text diff** and **string comparison** library for JavaScript and TypeScript. Compare two strings by **word, character, or line** and get the guaranteed-shortest edit script (`equal` / `insert` / `delete`), powered by **Myers' O(ND) algorithm** on typed arrays. Zero dependencies, Unicode-safe (Korean, CJK, emoji), ~2.9 KB min+gzip in the browser.
 
-Use it for text comparison UIs, document revision history, editor change tracking, test output diffing, or anywhere you need to highlight the difference between two strings — in Node.js or any browser.
+Use it for text comparison UIs, document revision history, editor change tracking, test output diffing, or anywhere you need to highlight the difference between two strings — in Node.js or any browser. **[Try the live demo.](https://krkarma777.github.io/string-difference-finder/)**
 
 ## Features
 
@@ -127,8 +127,12 @@ Notes for fairness are in [`bench/compare.mjs`](bench/compare.mjs). For history:
 
 ## Demo
 
+Hosted: **[krkarma777.github.io/string-difference-finder](https://krkarma777.github.io/string-difference-finder/)** (deployed from `master` by CI).
+
+Locally:
+
 ```sh
-npm run build
+npm run demo
 open demo/index.html
 ```
 

demo/index.html

@@ -68,6 +68,18 @@
     border-radius: 8px;
     font-size: 13px;
   }
+  label.opt {
+    display: inline-flex;
+    align-items: center;
+    gap: 6px;
+    font-size: 13px;
+    color: var(--muted);
+    text-transform: none;
+    letter-spacing: 0;
+    margin: 0;
+    cursor: pointer;
+  }
+  label.opt input { accent-color: var(--accent); }
   #time { color: var(--muted); font-size: 13px; }
   #result {
     background: var(--panel);
@@ -109,23 +121,27 @@ <h1><code>@krkarma777/string-diff</code> demo</h1>
       <option value="char">char</option>
       <option value="line">line</option>
     </select>
+    <label class="opt"><input type="checkbox" id="refine"> refine</label>
+    <label class="opt"><input type="checkbox" id="heuristic"> heuristic</label>
     <span id="time"></span>
   </div>
 
   <div id="result"><span class="empty">Press Compare to see the diff.</span></div>
 </main>
 
-<script src="../dist/string-diff.min.js"></script>
+<script src="./string-diff.min.js"></script>
 <script>
   const $ = id => document.getElementById(id);
 
   function render() {
     const a = $('a').value;
     const b = $('b').value;
     const mode = $('mode').value;
+    const refine = $('refine').checked;
+    const heuristic = $('heuristic').checked;
 
     const t0 = performance.now();
-    const entries = StringDiff.diff(a, b, { mode });
+    const entries = StringDiff.diff(a, b, { mode, refine, heuristic });
     const elapsed = performance.now() - t0;
 
     const result = $('result');

package.json

@@ -24,6 +24,7 @@
     "build": "tsup",
     "test": "node --test test/*.test.ts",
     "typecheck": "tsc --noEmit",
+    "demo": "npm run build && cp dist/string-diff.min.js demo/",
     "bench": "node bench/compare.mjs",
     "bench:legacy": "node bench/bench.mjs",
     "prepublishOnly": "npm run typecheck && npm test && npm run build"