PReact + HTM ~= React + JSX
React 需要使用 JSX , 直接使用 React.createElement()
会失去方便性。
PReact 是 React 的一个轻量级实现。配合 HTM 模板使用,可以不需要预编译。
PReact
- https://preactjs.com
- > Fast 3kB alternative to React with the same modern API.
HTM
Hyperscript Tagged Markup: JSX alternative using standard tagged templates
PReact + HTM
import { h, Component, render } from 'https://unpkg.com/preact?module';
import htm from 'https://unpkg.com/htm?module';
const html = htm.bind(h);
function Header(props){
return html`<h1>${props.title}</h1>`;
}
const app = html`<article><${Header} title="Hello"/></article>`;
render(app, document.body);