Question 1

How do I use HTM with React without any build tools?

Accepted Answer

Import HTM from a CDN like unpkg, bind it to React.createElement, and write templates directly in your HTML file. The README provides a live demo with hotlinking for quick setup.

Question 2

Is HTM faster than JSX?

Accepted Answer

HTM can be comparable or faster in lightweight setups due to caching, but performance varies; compiled JSX might edge it out in complex apps. The mini version offers control for optimizations.

Question 3

Can HTM work with TypeScript?

Accepted Answer

Yes, but it lacks built-in type definitions for its syntax, so you may need custom types or accept reduced type safety compared to native JSX with TypeScript.

Question 4

What's the difference between HTM and lit-html?

Accepted Answer

HTM focuses on JSX-like syntax for virtual DOM libraries like React, while lit-html is for HTML templates with a different binding model. HTM can bind to lit-html but serves a distinct use case.

Question 5

How to handle state and lifecycle in HTM with Preact?

Accepted Answer

Use HTM with Preact's component system; the README example shows class components with state management and lifecycle methods, similar to standard Preact but with HTM syntax.

Question 6

Does HTM support fragments like JSX?

Accepted Answer

HTM allows multiple root elements directly in templates, functioning like fragments without a dedicated component, but it doesn't use the React Fragment syntax.

Question 7

How to compile HTM away for production?

Accepted Answer

Use the babel-plugin-htm to transform HTM templates into standard JSX or hyperscript calls during build, removing runtime overhead as mentioned in the project's optimization notes.

htm

What is htm?

Overview

Use Cases

Best For

Related Projects

Found a gem we're missing?

Not Ideal For

Pros & Cons

Pros

Cons

Frequently Asked Questions