Mixon - A Type-Safe Microframework for Deno

The Need for Better Deno Web Frameworks

Building web applications with existing frameworks often reveals persistent challenges: lack of end-to-end type safety, complex configuration, and frameworks that feel too heavy for simple projects yet too limited for complex ones.

Deno projects requiring workflow management, HTMX integration, and strong typing often need multiple libraries with inconsistent APIs, creating maintenance overhead and type safety gaps.

Design Goals

Mixon aims to provide:

  • End-to-end type safety without configuration overhead
  • Built-in workflow management for stateful applications
  • First-class HTMX support for server-driven UIs
  • Zero dependencies and minimal footprint
  • Pattern matching for cleaner conditional logic

Comprehensive Type Safety

Mixon's foundation provides comprehensive type safety throughout the entire request lifecycle, offering compile-time guarantees that catch errors before production:

import { App, type } from "jsr:@srdjan/mixon";

const app = App();
const { utils } = app;

// Define a type-safe schema
const userSchema = type({
  name: "string",
  email: "string",
  age: "number",
});

// Type-safe route with validated parameters
app.post("/users", (ctx) => {
  if (!ctx.validated.body.ok) {
    utils.handleError(ctx, 400, "Invalid user data", ctx.validated.body.error);
    return;
  }

  // ctx.validated.body.value is fully typed!
  const user = ctx.validated.body.value;
  // ...
});

This approach eliminates runtime errors common in production environments.

Pattern Matching for Cleaner Logic

Pattern matching inspired by functional programming languages makes complex conditional logic more readable:

import { App, match } from "jsr:@srdjan/mixon";

const result = match(response.status)
  .with(200, () => "Success")
  .with(404, () => "Not Found")
  .with(500, () => "Server Error")
  .otherwise(() => "Unknown Status");

This replaced nested if-else chains with declarative, exhaustive pattern matching.

Built-in Workflow Engine

Mixon's standout feature is the built-in workflow engine providing type-safe state transition management in business applications:

// Define workflow types
type OrderState =
  | "Draft"
  | "Pending"
  | "Confirmed"
  | "Shipped"
  | "Delivered"
  | "Cancelled";
type OrderEvent = "Submit" | "Confirm" | "Ship" | "Deliver" | "Cancel";

// Create workflow engine with type parameters
const orderWorkflow = app.workflow<OrderState, OrderEvent>();

// Define the workflow
orderWorkflow.load({
  states: ["Draft", "Pending", "Confirmed", "Shipped", "Delivered", "Cancelled"],
  events: ["Submit", "Confirm", "Ship", "Deliver", "Cancel"],
  transitions: [
    {
      from: "Draft",
      to: "Pending",
      on: "Submit",
      task: {
        assign: "sales@example.com",
        message: "New order received: {orderNumber}",
      },
    },
    // Additional transitions...
  ],
  initial: "Draft",
});

The workflow engine automatically maintains audit trails and prevents invalid state transitions, solving common problems in e-commerce and business applications.

First-Class HTMX Integration

First-class HTMX support feels natural rather than bolted-on, with server-side rendering as a core feature:

/** @jsx h */
import { h, renderSSR } from "nano";
import { App } from "jsr:@srdjan/mixon";

const app = App();

// Product list route
app.get("/products", (ctx) => {
  const html = renderSSR(
    <section>
      {products.map((product) => (
        <article>
          <h3>{product.name}</h3>
          <div>${product.price}</div>
          <p>{product.description}</p>
          <button
            type="button"
            hx-get={`/api/fragments/product-detail/${product.id}`}
            hx-target="#content"
          >
            View Details
          </button>
        </article>
      ))}
    </section>,
  );

  ctx.response = new Response(html, {
    headers: { "Content-Type": "text/html" },
  });
});

This approach keeps most logic on the server while providing rich interactivity with minimal client-side JavaScript.

Performance Through Thoughtful Design

Balancing functional programming principles with strategic optimization delivers real-world performance:

  • Fast-path dispatch with O(1) middleware lookup
  • Static route matching with Map-based lookup
  • In-place context updates to minimize allocations
  • Controlled garbage collection pressure during request processing

The result is a framework that feels lightweight while performing well under load.

Explicit Error Handling

A Result type inspired by Rust provides explicit error handling throughout the framework:

// Type-safe error handling
if (!ctx.validated.body.ok) {
  utils.handleError(ctx, 400, "Invalid user data", ctx.validated.body.error);
  return;
}

// Safe access to validated data
const user = ctx.validated.body.value;

This approach eliminates the possibility of accessing invalid data and makes error states explicit in the type system.

Simple Getting Started

Mixon works seamlessly with Deno's import system:

import { App } from "jsr:@srdjan/mixon";

const app = App();
const { utils } = app;

app.get("/", (ctx) => {
  ctx.response = utils.createResponse(ctx, { message: "Hello from Mixon!" });
});

console.log("Server running at http://localhost:3000");
app.listen(3000);

No package managers, no complex configuration—just import and start building.

Key Insights from Building Mixon

Creating a web framework demonstrates that the best abstractions solve multiple problems with unified APIs. By combining type safety, workflow management, and HTMX support in a single, lightweight package, Mixon addresses complexity common across different projects.

Focusing on Deno's strengths—security, TypeScript-first development, and modern JavaScript—creates something that feels native to the ecosystem rather than ported from Node.js patterns.

Mixon represents an approach to web development: powerful enough for complex applications, simple enough for quick prototypes, and type-safe enough to prevent runtime errors that waste development time.

Whether building APIs, workflow-driven applications, or HTMX-powered UIs, Mixon provides necessary tools while staying true to Deno's philosophy of simplicity and security.