HyperFixi
A modular _hyperscript engine, built against upstream's own test suite. Human-readable UI behaviors from 18 KB gzipped (34 KB with everything) — and a verifiable target for LLM agents: generated code that parses or fails with structured diagnostics, checked by a real parser, renderable into 24 human languages for review.
Try It
Save this as an HTML file and open it in your browser — or try it live.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
</head>
<body>
<button _="on click toggle .active on me">Toggle</button>
<button
_="on click
set my.count to (my.count or 0) + 1
then put 'Clicks: ' + my.count into me"
>
Clicks: 0
</button>
<button _="on click toggle @hidden on #message">Show/Hide</button>
<p id="message">Hello from HyperFixi.</p>
<style>
.active {
background: #0066cc;
color: white;
border-radius: 4px;
}
</style>
<script src="https://unpkg.com/@hyperfixi/engine/dist/hyperfixi-hs.js"></script>
</body>
</html>
No server, no npm, no build step. Just save and open.
Install
Vite — the default. One plugin, zero options: it scans your files for _="..." attributes and emits a bundle with only the engine modules you use.
npm install @hyperfixi/vite-plugin
// vite.config.js
import { hyperfixi } from '@hyperfixi/vite-plugin';
export default { plugins: [hyperfixi()] };
Script tag — the engine's bundle, hyperscript with every module (~34 KB gz):
<script src="https://unpkg.com/@hyperfixi/engine/dist/hyperfixi-hs.js"></script>
For hypermedia attributes, add fixi or htmx 4 beside it
(and @lokascript/htmx-adapter for hx-* names in other languages); the engine runs the
hyperscript in content they swap in. @hyperfixi/core ships the
same file as dist/hyperfixi.js; core's own bundles (the ~352 KB hyperfixi.js, hyperfixi-hx.js,
hyperfixi-multilingual.js) retired in the 4.0 cycle.
For LLM Agents
An agent emitting hyperscript instead of free-form JavaScript gets properties JS can't offer: every candidate parses or fails with structured diagnostics (a real parser, no LLM in the checker), the parse comes back as a semantic IR to check against intent, diff_behaviors compares two snippets command by command and role by role (across languages too), and the result renders deterministically into 24 languages so a human can review the agent's work in their own language — measured, with the residual published.
The MCP server (@hyperfixi/mcp-server) exposes the whole loop: generate → validate_and_compile → repair from diagnostics → the hyperscript, as is, in an _="..." attribute. See AGENTS.md for the worked example and ground rules.
What You Get
- 43 commands -- toggle, add, remove, set, put, fetch, repeat, if/else, and more
- _hyperscript compatible -- existing hyperscript code works as-is
- Tree-shakeable -- the Vite plugin ships only the engine modules you use (18–34 KB gz);
hyperfixi-hs.js is ~34 KB
- TypeScript types -- full type safety with comprehensive definitions
- Agent-ready -- MCP server with a deterministic validate/repair/compile loop (AGENTS.md)
- Optional multilingual -- read and write hyperscript in 24 languages (lokascript.org)
- htmx alongside -- real htmx 4 or fixi beside the engine;
@lokascript/htmx-adapter localizes hx-* names
- 8100+ tests across all packages
Package Scopes
@hyperfixi/* -- Core engine: runtime, parser, commands, vite-plugin, behaviors@lokascript/* -- Multilingual: semantic parser, i18n grammar, language tools, domain DSLs
Use @hyperfixi/* packages. Add @lokascript/* only if you need multilingual support.
Under the Hood: the Multilingual Engine
The optional @lokascript/* layer lets you author hyperscript in 24 languages with
real SOV/VSO/V2 word-order transformation — and, unusually, it proves the
translation preserved meaning rather than merely "parsed". Two writeups go deep:
- Word order across 24 languages -- the linguistic
phenomena the semantic engine solves (verb-medial commands, fronted markers,
nested-block bodies, agglutinative tokenization, homonym disambiguation), each
tied to an executable guard test.
- Structural fidelity -- how a recall/precision/role/execution
ratchet catches silent meaning-drops that text-diff and parse-success both miss.
A transferable methodology for any meaning-preserving transform (i18n of program
structure, codegen, AST migrations).
Learn More
Going deeper:
Development
npm install
npm test --prefix packages/core
npm run build:browser --prefix packages/core
License
MIT
