feat: middleware implementation

src/assets.ts

@@ -1,7 +1,8 @@
+import { Assets } from "./types.ts";
 import { ensureDir, extname, join, mime, walk } from "./deps.ts";
 
-const assets = async (dir: string) => {
-  const meta = {
+export default async function assets(dir: string): Promise<Assets> {
+  const meta: Assets = {
     raw: new Map(),
     transpile: new Map(),
   };
@@ -30,6 +31,4 @@ const assets = async (dir: string) => {
   }
 
   return meta;
-};
-
-export default assets;
+}

src/deps.ts

@@ -11,6 +11,7 @@ export {
 } from "https://deno.land/std@0.135.0/path/mod.ts";
 export { Buffer, readLines } from "https://deno.land/std@0.135.0/io/mod.ts";
 export { serve } from "https://deno.land/std@0.135.0/http/server.ts";
+export type { Handler } from "https://deno.land/std@0.135.0/http/server.ts";
 export { readableStreamFromReader } from "https://deno.land/std@0.135.0/streams/conversion.ts";
 export { default as mime } from "https://esm.sh/mime-types@2.1.35";
 export { default as LRU } from "https://deno.land/x/lru@1.0.2/mod.ts";

src/oak/handler.ts

@@ -1,24 +1,14 @@
 import { Context } from "https://deno.land/x/oak@v10.5.1/mod.ts";
-import { isDev, sourceDirectory, vendorDirectory } from "../env.ts";
-import { resolveConfig, resolveImportMap } from "../config.ts";
 import { createRequestHandler } from "../server/requestHandler.ts";
+import { requestHandler } from "../server/middleware.ts";
 
-const cwd = Deno.cwd();
-
-const config = await resolveConfig(cwd);
-const importMap = await resolveImportMap(cwd, config);
-
-const requestHandler = await createRequestHandler({
-  cwd,
-  importMap,
-  paths: {
-    source: sourceDirectory,
-    vendor: vendorDirectory,
-  },
-  isDev,
+const ultraRequestHandler = createRequestHandler({
+  middleware: [
+    requestHandler,
+  ],
 });
 
-export async function ultraHandler(context: Context) {
+export async function ultraHandler(context: Context): Promise<void> {
   const serverRequestBody = context.request.originalRequest.getBody();
 
   const request = new Request(context.request.url.toString(), {
@@ -27,7 +17,7 @@ export async function ultraHandler(context: Context) {
     body: serverRequestBody.body,
   });
 
-  const response = await requestHandler(request);
+  const response = await ultraRequestHandler(request);
 
   context.response.status = response.status;
   context.response.headers = response.headers;

src/resolver.ts

@@ -35,8 +35,8 @@ export const stripTrailingSlash = (url: string): string => {
   return url.endsWith("/") ? url.slice(0, -1) : url;
 };
 
-export const resolveFileUrl = (from: string, to: string) => {
-  return new URL(toFileUrl(resolve(from, to)).toString());
+export const resolveFileUrl = (directoryPath: string, fileName: string) => {
+  return new URL(toFileUrl(resolve(directoryPath, fileName)).toString());
 };
 
 export const isRemoteSource = (value: string): boolean => {

src/server.ts

@@ -1,27 +1,12 @@
-import { serve } from "./deps.ts";
-import {
-  devServerWebsocketPort,
-  isDev,
-  port,
-  sourceDirectory,
-  vendorDirectory,
-} from "./env.ts";
-import { resolveConfig, resolveImportMap } from "./config.ts";
+import { Middleware } from "./types.ts";
 import { createRequestHandler } from "./server/requestHandler.ts";
+import { devServerWebsocketPort, isDev, port } from "./env.ts";
+import { serve } from "./deps.ts";
 
-const cwd = Deno.cwd();
-const config = await resolveConfig(cwd);
-const importMap = await resolveImportMap(cwd, config);
-
-const server = async () => {
-  const requestHandler = await createRequestHandler({
-    cwd,
-    importMap,
-    paths: {
-      source: sourceDirectory,
-      vendor: vendorDirectory,
-    },
-    isDev,
+export default function () {
+  const middleware: Middleware[] = [];
+  const requestHandler = createRequestHandler({
+    middleware,
   });
 
   let message = `Ultra running http://localhost:${port}`;
@@ -32,7 +17,14 @@ const server = async () => {
 
   console.log(message);
 
-  return serve(requestHandler, { port: +port });
-};
-
-export default server;
+  return {
+    start: () => {
+      serve(requestHandler, {
+        port: Number(port),
+      });
+    },
+    use: (middlewareFunction: Middleware) => {
+      middleware.push(middlewareFunction);
+    },
+  };
+}

src/server/middleware.ts

@@ -0,0 +1,190 @@
+import assets from "../assets.ts";
+import render from "../render.ts";
+import transform from "../transform.ts";
+import { Context, Middleware, Next } from "../types.ts";
+import { LRU, readableStreamFromReader } from "../deps.ts";
+import { createURL } from "./request.ts";
+import {
+  disableStreaming,
+  isDev,
+  lang,
+  sourceDirectory,
+  vendorDirectory,
+} from "../env.ts";
+import {
+  replaceFileExt,
+  resolveFileUrl,
+  ValidExtensions,
+} from "../resolver.ts";
+import { resolveConfig, resolveImportMap } from "../config.ts";
+
+const memory = new LRU<string>(500);
+const [
+  rawAssets,
+  vendorAssets,
+  importMap,
+] = await Promise.all([
+  assets(sourceDirectory),
+  assets(`.ultra/${vendorDirectory}`),
+  (async () => {
+    const cwd = Deno.cwd();
+    const config = await resolveConfig(cwd);
+    const importMap = await resolveImportMap(cwd, config);
+    return importMap;
+  })(),
+]);
+
+export function dispatch<C extends Context = Context>(
+  middlewares: Middleware<C>[],
+  context: C,
+  index = 0,
+): Next {
+  const nextMiddlewareFunction = middlewares[index];
+  return nextMiddlewareFunction
+    ? async (shortCircuit?: boolean) => {
+      if (shortCircuit) {
+        return;
+      }
+
+      await nextMiddlewareFunction(
+        context,
+        dispatch(middlewares, context, index + 1),
+      );
+    }
+    : async () => {};
+}
+
+export function compose<C extends Context = Context>(
+  ...middlewares: Middleware<C>[]
+): Middleware<C> {
+  return async function composedMiddleware(
+    context: C,
+    next: Next,
+  ) {
+    await dispatch(middlewares, context)();
+    await next();
+  };
+}
+
+export const renderPage: Middleware = async (context, next) => {
+  const url = createURL(context.request);
+
+  const body = await render({
+    url,
+    importMap,
+    lang,
+    disableStreaming,
+  });
+
+  context.response.body = body;
+  context.response.headers = {
+    ...context.response.headers,
+    "content-type": "text/html; charset=utf-8",
+  };
+
+  await next(true);
+};
+
+export const staticAsset: Middleware = async ({ request, response }, next) => {
+  const url = createURL(request);
+
+  const filePath = `${sourceDirectory}${url.pathname}`;
+  if (!rawAssets.raw.has(filePath)) {
+    await next();
+    return;
+  }
+
+  const contentType = rawAssets.raw.get(filePath);
+  if (!contentType) {
+    response.status = 415;
+    response.statusText = "Unsupported Media Type";
+
+    await next(true);
+    return;
+  }
+
+  response.body = readableStreamFromReader(await Deno.open(`./${filePath}`));
+  response.headers = {
+    ...response.headers,
+    "content-type": contentType,
+  };
+
+  await next(true);
+};
+
+export const transpileSource: Middleware = async (context, next) => {
+  const url = createURL(context.request);
+
+  const transpilation = async (file: string) => {
+    let js = memory.get(url.pathname);
+
+    if (!js) {
+      const source = await Deno.readTextFile(
+        resolveFileUrl(Deno.cwd(), file),
+      );
+      const t0 = performance.now();
+
+      js = await transform({
+        source,
+        sourceUrl: url,
+        importMap,
+      });
+
+      const t1 = performance.now();
+      const duration = (t1 - t0).toFixed(2);
+
+      console.log(`Transpile ${file} in ${duration}ms`);
+
+      if (!isDev) {
+        memory.set(url.pathname, js);
+      }
+    }
+
+    return js;
+  };
+
+  const fileTypes: ValidExtensions[] = [".jsx", ".tsx", ".ts"];
+  for (const fileType of fileTypes) {
+    const filePath = `${sourceDirectory}${
+      replaceFileExt(url.pathname, fileType)
+    }`;
+    if (rawAssets.transpile.has(filePath)) {
+      context.response.body = await transpilation(filePath);
+      context.response.headers = {
+        ...context.response.headers,
+        "content-type": "application/javascript",
+      };
+      await next(true);
+      return;
+    }
+  }
+
+  await next();
+};
+
+export const vendorMap: Middleware = async ({ request, response }, next) => {
+  const url = createURL(request);
+
+  if (!vendorAssets.raw.has(`.ultra${url.pathname}`)) {
+    await next();
+    return;
+  }
+
+  const file = await Deno.open(`./.ultra${url.pathname}`);
+  const body = readableStreamFromReader(file);
+
+  response.body = body;
+  response.headers = {
+    ...response.headers,
+    "content-type": "application/javascript",
+  };
+
+  await next(true);
+};
+
+export const requestHandler: Middleware = compose(
+  transpileSource,
+  staticAsset,
+  vendorMap,
+  renderPage,
+);

src/server/request.ts

@@ -0,0 +1,15 @@
+export function createURL(request: Request): URL {
+  const url = new URL(request.url);
+
+  const xForwardedProto = request.headers.get("x-forwarded-proto");
+  if (xForwardedProto) {
+    url.protocol = `${xForwardedProto}:`;
+  }
+
+  const xForwardedHost = request.headers.get("x-forwarded-host");
+  if (xForwardedHost) {
+    url.hostname = xForwardedHost;
+  }
+
+  return url;
+}