Framework Bundle

Self-contained reactive framework - No build step, zero dependencies

89 KBUncompressed
20 KBGzipped
0Dependencies

Basic Tests

Simple test page that verifies all framework features work correctly. Includes automated tests and an interactive counter component.

Test SuiteInteractive

Jellyfin Settings Modal

Complete POC of a settings modal that replaces 230 lines of manual DOM manipulation with clean, reactive components. Features forms, validation, and notifications.

Full DemoProduction Ready

Static Site Integration

Demonstrates how to embed reactive components in static HTML pages. Features unit converters, vanilla JS event binding, DOM attribute propagation, and rich data injection via component references.

IntegrationInterop

PWA Offline Demo

Service worker with versioned caching. Provides the same cache coherency as webpack without modifying source files. Uses spider-deps to discover dependencies and generates atomic, version-safe offline caches.

OfflinePWA

Features

Documentation

Quick Start

<script type="module">
import { defineComponent, html } from '../dist/framework.js';

defineComponent('my-counter', {
    data() {
        return { count: 0 };
    },

    methods: {
        increment() { this.state.count++; }
    },

    template() {
        return html`
            <div>
                <h2>Count: ${this.state.count}</h2>
                <button on-click="increment">+1</button>
            </div>
        `;
    }
});
</script>

<my-counter></my-counter>