µhtml-ssr

 

^{Social Media Photo by Nathan Dumlao on Unsplash}

µhtml for Service Worker, Web Worker, NodeJS, and other SSR cases, based on µcontent logic, but without 3rd party tools (no minification, etc.).

This module can be used as drop-in replacement for µhtml components, but rendered SSR, or where there is no DOM.

This module also exports uhtml-ssr/async helpers to always resolve asynchronous interpolations.

``js
import {render, html, svg} from 'uhtml-ssr';

// render accepts a callback instead of a DOM node
// or a response object with a res.write(content) method.
render(String, html

Hello µhtml-ssr 👋

);
// "

Hello µhtml-ssr 👋

"
`

Exports have feature parity with µhtml, and pretty much everything else works the same, except:

inline DOM* events are not rendered, these are simply removed
* ref=${...} attributes receives null as there's no node or element to pass around




Isomorphic µhtml Components

If you are using CommonJS you could use require-overrides module to fake uhtml as uhtml-ssr.

`js
// component.js
const {html} = require('uhtml');
module.exports = (name) => {
return htmlHello ${name};
};

// index.js
const overrides = require('require-overrides');
overrides.set('uhtml', 'uhtml-ssr');

const {render} = require('uhtml-ssr');

const Component = require('./component.js');

console.log(render(String, Component('World')));
// "Hello World"
``