Generates standalone HTML page with Brotli compression

by dledle2

HTML

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Compressed Page Generator (Brotli) (needs to import an external wasm module) v01</title>
  <style>
    body { font-family: sans-serif; padding: 1rem; }
    label { display: block; margin: 1rem 0 0.5rem; font-weight: bold; }
    textarea { width: 100%; box-sizing: border-box; font-family: monospace; margin-bottom: 1rem; }
    #payloadInput { height: 200px; }
    #output { height: 300px; white-space: pre; overflow: auto; }
    #description { margin-top: 1.5rem; font-weight: bold; }
    button { padding: 0.5rem 1rem; margin-top: 0.5rem; cursor: pointer; }
  </style>
</head>
<body>
  <h1>Compressed Page Generator (Brotli) (needs to import an external wasm module) v01</h1>

  <label for="payloadInput">Paste full HTML page here:</label>
  <textarea id="payloadInput" placeholder="&lt;!DOCTYPE html&gt;&#10;&lt;html&gt;…"></textarea>

  <button id="generateBtn">Generate Page</button>

  <div id="description">Below is the HTML for your standalone runner page:</div>
  <textarea id="output" readonly placeholder="Generated runner page code…"></textarea>

  <script type="module">
    // 1. Load Brotli-WASM (browser ESM build)
    const brotliPromise = import(
      "https://unpkg.com/[email protected]/index.web.js?module"
    ).then(m => m.default);

    // 2. Compress function: text → Uint8Array → Brotli → Uint8Array → base64
    async function compress(text) {
      const brotli = await brotliPromise;
      const inputBytes = new TextEncoder().encode(text);
      const compressedBuffer = brotli.compress(inputBytes);
      const compressedBytes = new Uint8Array(compressedBuffer);
      // Base64 for embedding
      return btoa(String.fromCharCode(...compressedBytes));
    }

    // 3. Generate the runner page HTML, embedding compressed data & decompressor
    async function generatePage() {
      const payload = document.getElementById('payloadInput').value;
      if (!payload) {
        alert('Please...