Mark G•2y ago

Suggestions for minimal JSX rendering?

Any suggestions for rendering jsx to a string (or ideally a stream), in the most minimal manner from Deno? I'm currently using preact and preact-render-to-string, but i feel that may just be a bit overkill. I don't need client-side, hooks, or any other preact/react features.

2 Replies

ioB•2y ago

I recommend https://deno.land/x/nano_jsx@v0.0.36

Mark G•2y ago

nano_jsx didn't seem to be a drop-in replacement, but after a bit of poking around in preact, it doesn't appear to be all that excessive really anyway. And I've managed to par it down to the bare essentials using a minimal preact.js and import map...

{
  "compilerOptions": {
    "jsx": "react-jsx",
    "jsxImportSource": "preact"
  },
  "imports": {
    "preact": "./preact.js",
    "preact/": "https://esm.sh/*preact@10.12.1/",
    "preact-render-to-string": "https://esm.sh/*preact-render-to-string@5.2.6"
  }
}

{
  "compilerOptions": {
    "jsx": "react-jsx",
    "jsxImportSource": "preact"
  },
  "imports": {
    "preact": "./preact.js",
    "preact/": "https://esm.sh/*preact@10.12.1/",
    "preact-render-to-string": "https://esm.sh/*preact-render-to-string@5.2.6"
  }
}

export { createElement as h } from "preact/src/create-element.js";

export const options = {};

export function Fragment(props) {
    return props.children;
}

export { createElement as h } from "preact/src/create-element.js";

export const options = {};

export function Fragment(props) {
    return props.children;
}

^ ./preact.js this provides just enough for JSX to HTML