htm
Hyperscript Tagged Markup: JSX alternative using standard tagged templates, with compiler support.
A tiny JavaScript library under 600 bytes that lets you write JSX-like component markup directly in the browser without any build tool or compiler, using standard tagged template strings.
HTM stands for Hyperscript Tagged Markup. It lets you write JSX-like code in plain JavaScript without needing a build tool or compiler. JSX is the HTML-like syntax that React and similar libraries use to describe what should appear on screen, but normally you need a build step to convert that syntax into regular JavaScript before a browser can run it. HTM removes that requirement.
The way it works is by using a JavaScript feature called tagged templates, which are already part of the language and run in every modern browser without any special setup. You write your component markup inside a template string using backtick characters, and HTM parses it into the same kind of structure that JSX would produce, making it compatible with React, Preact, and other libraries that use the same component model.
The syntax is almost identical to JSX with a few small differences in how you reference component variables. Spreading props, self-closing tags, fragments with multiple root elements, boolean attributes, and HTML-style comments all work. The README lists these as features that HTM supports where JSX does not.
The library is very small, under 600 bytes when included directly in a browser, and under 500 bytes when used with Preact. There is also a minimal version called htm/mini that is under 450 bytes.
For development without any build step at all, you can import HTM directly from a CDN URL and write a full application in a single HTML file. The README includes a working example of a to-do list app written this way, with nothing more than a script tag and a text editor. For production use, there is an optional Babel plugin that compiles HTM away entirely at build time so it adds zero bytes to the final output.
The project is described as stable, fast, and ready for production use. It works with any library or renderer that accepts JSX-style function calls, not just React and Preact.
Where it fits
- Build a React or Preact app in a single HTML file with no build tools, npm, or webpack required.
- Prototype a component-based UI instantly in the browser without setting up a project from scratch.
- Teach JSX and component concepts to beginners without requiring them to install any build tools.
- Remove htm from a production bundle entirely at build time using the included Babel plugin for zero-byte overhead.