@stacksjs/stx 0.2.168 → 0.2.170

package/dist/compression.d.ts

@@ -0,0 +1,23 @@
+/** Whether this content type is worth compressing. */
+export declare function isCompressible(contentType: string | null): boolean;
+/**
+ * The best encoding both sides support, or `null` for none.
+ *
+ * Deliberately ignores the q-values in `Accept-Encoding`. Honouring them means
+ * parsing a header that is, in practice, one of about four fixed strings every
+ * real browser sends, all of which accept both encodings; the only clients
+ * that weight them are testing tools.
+ */
+export declare function negotiateEncoding(acceptEncoding: string | null): 'br' | 'gzip' | null;
+/**
+ * Return `response` compressed, or unchanged when it should not be.
+ *
+ * Never throws and never drops a body: a failed compress logs nothing and
+ * returns the original, because shipping bytes uncompressed is a slower
+ * success and a broken compress step is an outage.
+ */
+export declare function compressResponse(request: Request, response: Response, options?: CompressionOptions): Promise<Response>;
+export declare interface CompressionOptions {
+  threshold?: number
+  quality?: number
+}

package/dist/compression.js

@@ -0,0 +1,68 @@
+import zlib from "node:zlib";
+const COMPRESSIBLE = [
+  "text/",
+  "application/json",
+  "application/javascript",
+  "application/xml",
+  "application/xhtml+xml",
+  "application/rss+xml",
+  "application/atom+xml",
+  "application/manifest+json",
+  "image/svg+xml"
+], NEVER_BUFFER = [
+  "text/event-stream",
+  "multipart/x-mixed-replace"
+], MIN_BYTES = 1024;
+export function isCompressible(contentType) {
+  if (!contentType)
+    return !1;
+  const type = contentType.toLowerCase();
+  if (NEVER_BUFFER.some((prefix) => type.startsWith(prefix)))
+    return !1;
+  return COMPRESSIBLE.some((prefix) => type.startsWith(prefix));
+}
+export function negotiateEncoding(acceptEncoding) {
+  if (!acceptEncoding)
+    return null;
+  const accepted = acceptEncoding.toLowerCase();
+  if (accepted.includes("br"))
+    return "br";
+  if (accepted.includes("gzip"))
+    return "gzip";
+  return null;
+}
+export async function compressResponse(request, response, options = {}) {
+  if (response.headers.get("content-encoding"))
+    return response;
+  if (response.status === 204 || response.status === 304 || !response.body)
+    return response;
+  if (!isCompressible(response.headers.get("content-type")))
+    return response;
+  const encoding = negotiateEncoding(request.headers.get("accept-encoding"));
+  if (!encoding)
+    return response;
+  try {
+    const body = Buffer.from(await response.clone().arrayBuffer());
+    if (body.length < (options.threshold ?? MIN_BYTES))
+      return response;
+    const compressed = encoding === "br" ? zlib.brotliCompressSync(body, {
+      params: {
+        [zlib.constants.BROTLI_PARAM_QUALITY]: options.quality ?? 5,
+        [zlib.constants.BROTLI_PARAM_SIZE_HINT]: body.length
+      }
+    }) : zlib.gzipSync(body);
+    if (compressed.length >= body.length)
+      return response;
+    const headers = new Headers(response.headers);
+    headers.set("Content-Encoding", encoding);
+    headers.set("Content-Length", String(compressed.length));
+    headers.append("Vary", "Accept-Encoding");
+    return new Response(compressed, {
+      status: response.status,
+      statusText: response.statusText,
+      headers
+    });
+  } catch {
+    return response;
+  }
+}

package/dist/dev-server/serve-file.js

@@ -24,6 +24,7 @@ import {
   setupKeyboardShortcuts
 } from "./index.js";
 import { serveMarkdownFile } from "./serve-markdown.js";
+import { compressResponse } from "../compression.js";
 export async function serveStxFile(filePath, options = {}) {
   const port = options.port || 3000, watch = options.watch !== !1, hotReload = options.hotReload !== !1 && watch;
   let hmrServer = null, actualHmrPort = options.hmrPort || port + 1;
@@ -135,241 +136,243 @@ export async function serveStxFile(filePath, options = {}) {
   const server = serve({
     port: actualPort,
     async fetch(request) {
-      const url = new URL(request.url);
-      if (customRouter)
-        try {
-          const routerResponse = await customRouter.handleRequest(request);
-          if (routerResponse.status !== 404)
-            return routerResponse;
-        } catch {}
-      if (apiRoutes[url.pathname])
-        try {
-          return await apiRoutes[url.pathname](request);
-        } catch (err) {
-          return new Response(JSON.stringify({ error: err.message }), {
-            status: 500,
-            headers: { "Content-Type": "application/json" }
-          });
-        }
-      if (url.pathname === "/")
-        return (async () => {
-          let content = await injectCrosswindCSS(htmlContent || "");
-          if (hotReload)
-            content = injectHotReload(content, actualHmrPort);
-          if (options.native) {
-            const nativeSidebarInjection = "<style>[data-stx-sidebar],.stx-sidebar{display:none!important}</style><script>window.__craftNativeSidebar=true;document.documentElement.classList.add('has-native-sidebar')</script>";
-            if (content.includes("<head>"))
-              content = content.replace("<head>", `<head>${nativeSidebarInjection}`);
-            else if (content.includes("<html"))
-              content = content.replace(/(<html[^>]*>)/, `$1<head>${nativeSidebarInjection}</head>`);
-            else
-              content = `<head>${nativeSidebarInjection}</head>` + content;
-          }
-          if (options.titlebarHidden) {
-            const tbInjection = "<style>html.stx-titlebar-hidden .stx-traffic-lights-dot{visibility:hidden}</style><script>document.documentElement.classList.add('stx-titlebar-hidden')</script>";
-            if (content.includes("<head>"))
-              content = content.replace("<head>", `<head>${tbInjection}`);
-            else if (content.includes("<html"))
-              content = content.replace(/(<html[^>]*>)/, `$1<head>${tbInjection}</head>`);
-            else
-              content = `<head>${tbInjection}</head>${content}`;
-          }
-          return content;
-        })().then((content) => new Response(content, {
-          headers: {
-            "Content-Type": "text/html",
-            "Cache-Control": "no-store, no-cache, must-revalidate",
-            Pragma: "no-cache",
-            Expires: "0"
+      return compressResponse(request, await (async () => {
+        const url = new URL(request.url);
+        if (customRouter)
+          try {
+            const routerResponse = await customRouter.handleRequest(request);
+            if (routerResponse.status !== 404)
+              return routerResponse;
+          } catch {}
+        if (apiRoutes[url.pathname])
+          try {
+            return await apiRoutes[url.pathname](request);
+          } catch (err) {
+            return new Response(JSON.stringify({ error: err.message }), {
+              status: 500,
+              headers: { "Content-Type": "application/json" }
+            });
           }
-        }));
-      const requestedPath = path.join(outputDir, url.pathname);
-      if (fs.existsSync(requestedPath) && fs.statSync(requestedPath).isFile()) {
-        const file = Bun.file(requestedPath), ext = path.extname(requestedPath).toLowerCase();
-        let contentType = "text/plain";
-        if (ext === ".ts" || ext === ".tsx") {
-          const transpiler = new Bun.Transpiler({ loader: ext === ".tsx" ? "tsx" : "ts" }), code = await file.text(), js = transpiler.transformSync(code);
-          return new Response(js, {
-            headers: {
-              "Content-Type": "application/javascript",
-              "Cache-Control": "no-store, no-cache, must-revalidate",
-              Pragma: "no-cache",
-              Expires: "0"
+        if (url.pathname === "/")
+          return (async () => {
+            let content = await injectCrosswindCSS(htmlContent || "");
+            if (hotReload)
+              content = injectHotReload(content, actualHmrPort);
+            if (options.native) {
+              const nativeSidebarInjection = "<style>[data-stx-sidebar],.stx-sidebar{display:none!important}</style><script>window.__craftNativeSidebar=true;document.documentElement.classList.add('has-native-sidebar')</script>";
+              if (content.includes("<head>"))
+                content = content.replace("<head>", `<head>${nativeSidebarInjection}`);
+              else if (content.includes("<html"))
+                content = content.replace(/(<html[^>]*>)/, `$1<head>${nativeSidebarInjection}</head>`);
+              else
+                content = `<head>${nativeSidebarInjection}</head>` + content;
             }
-          });
-        }
-        switch (ext) {
-          case ".html":
-            contentType = "text/html";
-            break;
-          case ".css":
-            contentType = "text/css";
-            break;
-          case ".js":
-            contentType = "text/javascript";
-            break;
-          case ".json":
-            contentType = "application/json";
-            break;
-          case ".png":
-            contentType = "image/png";
-            break;
-          case ".jpg":
-          case ".jpeg":
-            contentType = "image/jpeg";
-            break;
-          case ".gif":
-            contentType = "image/gif";
-            break;
-          case ".woff":
-            contentType = "font/woff";
-            break;
-          case ".woff2":
-            contentType = "font/woff2";
-            break;
-          case ".ttf":
-            contentType = "font/ttf";
-            break;
-          case ".otf":
-            contentType = "font/otf";
-            break;
-          case ".eot":
-            contentType = "application/vnd.ms-fontobject";
-            break;
-        }
-        return new Response(file, {
-          headers: { "Content-Type": contentType }
-        });
-      }
-      const sourceDir = path.dirname(absolutePath), sourcePath = path.join(sourceDir, url.pathname);
-      if (fs.existsSync(sourcePath) && fs.statSync(sourcePath).isFile()) {
-        const file = Bun.file(sourcePath), ext = path.extname(sourcePath).toLowerCase();
-        let contentType = "text/plain";
-        if (ext === ".ts" || ext === ".tsx") {
-          const transpiler = new Bun.Transpiler({ loader: ext === ".tsx" ? "tsx" : "ts" }), code = await file.text(), js = transpiler.transformSync(code);
-          return new Response(js, {
+            if (options.titlebarHidden) {
+              const tbInjection = "<style>html.stx-titlebar-hidden .stx-traffic-lights-dot{visibility:hidden}</style><script>document.documentElement.classList.add('stx-titlebar-hidden')</script>";
+              if (content.includes("<head>"))
+                content = content.replace("<head>", `<head>${tbInjection}`);
+              else if (content.includes("<html"))
+                content = content.replace(/(<html[^>]*>)/, `$1<head>${tbInjection}</head>`);
+              else
+                content = `<head>${tbInjection}</head>${content}`;
+            }
+            return content;
+          })().then((content) => new Response(content, {
             headers: {
-              "Content-Type": "application/javascript",
+              "Content-Type": "text/html",
               "Cache-Control": "no-store, no-cache, must-revalidate",
               Pragma: "no-cache",
               Expires: "0"
             }
+          }));
+        const requestedPath = path.join(outputDir, url.pathname);
+        if (fs.existsSync(requestedPath) && fs.statSync(requestedPath).isFile()) {
+          const file = Bun.file(requestedPath), ext = path.extname(requestedPath).toLowerCase();
+          let contentType = "text/plain";
+          if (ext === ".ts" || ext === ".tsx") {
+            const transpiler = new Bun.Transpiler({ loader: ext === ".tsx" ? "tsx" : "ts" }), code = await file.text(), js = transpiler.transformSync(code);
+            return new Response(js, {
+              headers: {
+                "Content-Type": "application/javascript",
+                "Cache-Control": "no-store, no-cache, must-revalidate",
+                Pragma: "no-cache",
+                Expires: "0"
+              }
+            });
+          }
+          switch (ext) {
+            case ".html":
+              contentType = "text/html";
+              break;
+            case ".css":
+              contentType = "text/css";
+              break;
+            case ".js":
+              contentType = "text/javascript";
+              break;
+            case ".json":
+              contentType = "application/json";
+              break;
+            case ".png":
+              contentType = "image/png";
+              break;
+            case ".jpg":
+            case ".jpeg":
+              contentType = "image/jpeg";
+              break;
+            case ".gif":
+              contentType = "image/gif";
+              break;
+            case ".woff":
+              contentType = "font/woff";
+              break;
+            case ".woff2":
+              contentType = "font/woff2";
+              break;
+            case ".ttf":
+              contentType = "font/ttf";
+              break;
+            case ".otf":
+              contentType = "font/otf";
+              break;
+            case ".eot":
+              contentType = "application/vnd.ms-fontobject";
+              break;
+          }
+          return new Response(file, {
+            headers: { "Content-Type": contentType }
           });
         }
-        switch (ext) {
-          case ".html":
-            contentType = "text/html";
-            break;
-          case ".css":
-            contentType = "text/css";
-            break;
-          case ".js":
-            contentType = "text/javascript";
-            break;
-          case ".json":
-            contentType = "application/json";
-            break;
-          case ".png":
-            contentType = "image/png";
-            break;
-          case ".jpg":
-          case ".jpeg":
-            contentType = "image/jpeg";
-            break;
-          case ".gif":
-            contentType = "image/gif";
-            break;
-          case ".svg":
-            contentType = "image/svg+xml";
-            break;
-          case ".ico":
-            contentType = "image/x-icon";
-            break;
-          case ".woff":
-            contentType = "font/woff";
-            break;
-          case ".woff2":
-            contentType = "font/woff2";
-            break;
-          case ".ttf":
-            contentType = "font/ttf";
-            break;
-          case ".otf":
-            contentType = "font/otf";
-            break;
-          case ".eot":
-            contentType = "application/vnd.ms-fontobject";
-            break;
-        }
-        return new Response(file, {
-          headers: { "Content-Type": contentType }
-        });
-      }
-      const publicPath = path.join(process.cwd(), "public", url.pathname);
-      if (fs.existsSync(publicPath) && fs.statSync(publicPath).isFile()) {
-        const file = Bun.file(publicPath), ext = path.extname(publicPath).toLowerCase();
-        let contentType = "application/octet-stream";
-        if (ext === ".ts" || ext === ".tsx") {
-          const transpiler = new Bun.Transpiler({ loader: ext === ".tsx" ? "tsx" : "ts" }), code = await file.text(), js = transpiler.transformSync(code);
-          return new Response(js, {
-            headers: {
-              "Content-Type": "application/javascript",
-              "Cache-Control": "no-store, no-cache, must-revalidate",
-              Pragma: "no-cache",
-              Expires: "0"
-            }
+        const sourceDir = path.dirname(absolutePath), sourcePath = path.join(sourceDir, url.pathname);
+        if (fs.existsSync(sourcePath) && fs.statSync(sourcePath).isFile()) {
+          const file = Bun.file(sourcePath), ext = path.extname(sourcePath).toLowerCase();
+          let contentType = "text/plain";
+          if (ext === ".ts" || ext === ".tsx") {
+            const transpiler = new Bun.Transpiler({ loader: ext === ".tsx" ? "tsx" : "ts" }), code = await file.text(), js = transpiler.transformSync(code);
+            return new Response(js, {
+              headers: {
+                "Content-Type": "application/javascript",
+                "Cache-Control": "no-store, no-cache, must-revalidate",
+                Pragma: "no-cache",
+                Expires: "0"
+              }
+            });
+          }
+          switch (ext) {
+            case ".html":
+              contentType = "text/html";
+              break;
+            case ".css":
+              contentType = "text/css";
+              break;
+            case ".js":
+              contentType = "text/javascript";
+              break;
+            case ".json":
+              contentType = "application/json";
+              break;
+            case ".png":
+              contentType = "image/png";
+              break;
+            case ".jpg":
+            case ".jpeg":
+              contentType = "image/jpeg";
+              break;
+            case ".gif":
+              contentType = "image/gif";
+              break;
+            case ".svg":
+              contentType = "image/svg+xml";
+              break;
+            case ".ico":
+              contentType = "image/x-icon";
+              break;
+            case ".woff":
+              contentType = "font/woff";
+              break;
+            case ".woff2":
+              contentType = "font/woff2";
+              break;
+            case ".ttf":
+              contentType = "font/ttf";
+              break;
+            case ".otf":
+              contentType = "font/otf";
+              break;
+            case ".eot":
+              contentType = "application/vnd.ms-fontobject";
+              break;
+          }
+          return new Response(file, {
+            headers: { "Content-Type": contentType }
           });
         }
-        switch (ext) {
-          case ".html":
-            contentType = "text/html";
-            break;
-          case ".css":
-            contentType = "text/css";
-            break;
-          case ".js":
-            contentType = "text/javascript";
-            break;
-          case ".json":
-            contentType = "application/json";
-            break;
-          case ".png":
-            contentType = "image/png";
-            break;
-          case ".jpg":
-          case ".jpeg":
-            contentType = "image/jpeg";
-            break;
-          case ".gif":
-            contentType = "image/gif";
-            break;
-          case ".svg":
-            contentType = "image/svg+xml";
-            break;
-          case ".ico":
-            contentType = "image/x-icon";
-            break;
-          case ".woff":
-            contentType = "font/woff";
-            break;
-          case ".woff2":
-            contentType = "font/woff2";
-            break;
-          case ".ttf":
-            contentType = "font/ttf";
-            break;
-          case ".otf":
-            contentType = "font/otf";
-            break;
-          case ".eot":
-            contentType = "application/vnd.ms-fontobject";
-            break;
+        const publicPath = path.join(process.cwd(), "public", url.pathname);
+        if (fs.existsSync(publicPath) && fs.statSync(publicPath).isFile()) {
+          const file = Bun.file(publicPath), ext = path.extname(publicPath).toLowerCase();
+          let contentType = "application/octet-stream";
+          if (ext === ".ts" || ext === ".tsx") {
+            const transpiler = new Bun.Transpiler({ loader: ext === ".tsx" ? "tsx" : "ts" }), code = await file.text(), js = transpiler.transformSync(code);
+            return new Response(js, {
+              headers: {
+                "Content-Type": "application/javascript",
+                "Cache-Control": "no-store, no-cache, must-revalidate",
+                Pragma: "no-cache",
+                Expires: "0"
+              }
+            });
+          }
+          switch (ext) {
+            case ".html":
+              contentType = "text/html";
+              break;
+            case ".css":
+              contentType = "text/css";
+              break;
+            case ".js":
+              contentType = "text/javascript";
+              break;
+            case ".json":
+              contentType = "application/json";
+              break;
+            case ".png":
+              contentType = "image/png";
+              break;
+            case ".jpg":
+            case ".jpeg":
+              contentType = "image/jpeg";
+              break;
+            case ".gif":
+              contentType = "image/gif";
+              break;
+            case ".svg":
+              contentType = "image/svg+xml";
+              break;
+            case ".ico":
+              contentType = "image/x-icon";
+              break;
+            case ".woff":
+              contentType = "font/woff";
+              break;
+            case ".woff2":
+              contentType = "font/woff2";
+              break;
+            case ".ttf":
+              contentType = "font/ttf";
+              break;
+            case ".otf":
+              contentType = "font/otf";
+              break;
+            case ".eot":
+              contentType = "application/vnd.ms-fontobject";
+              break;
+          }
+          return new Response(file, {
+            headers: { "Content-Type": contentType }
+          });
         }
-        return new Response(file, {
-          headers: { "Content-Type": contentType }
-        });
-      }
-      return new Response("Not Found", { status: 404 });
+        return new Response("Not Found", { status: 404 });
+      })());
     },
     error(error) {
       return new Response(`<pre>${error}

package/dist/index.d.ts

@@ -129,6 +129,7 @@ export * from './custom-directives';
 // database moved to stx/database
 export * from './defer';
 export * from './deploy/index';
+export * from './compression';
 export * from './dev-server';
 export * from './document-shell';
 export * from './fragment-container';

package/dist/index.js

@@ -55,6 +55,7 @@ export * from "./csp.js";
 export * from "./custom-directives.js";
 export * from "./defer.js";
 export * from "./deploy/index.js";
+export * from "./compression.js";
 export * from "./dev-server.js";
 export * from "./document-shell.js";
 export * from "./fragment-container.js";