NoHydration

Content the browser never hydrates: the server renders it without hydration keys, and while the page hydrates the browser leaves that markup exactly as it is (no code runs for it, no event handlers or reactivity are attached). Use it for static, heavy markup such as rendered documentation or a long article. Rendered by the browser alone (a client-side navigation), its children render normally.

Import#

import { NoHydration } from "@shadow-js/web";

Signature#

function NoHydration(props: NoHydrationProps): Accessor<unknown>

Parameters#

Returns#

An accessor of the content: the children, or the server's own nodes while the browser hydrates.

Examples#

import { NoHydration } from "@shadow-js/web";

function Docs(props: { html: string }) {
  return (
    <NoHydration>
      <article innerHTML={props.html} />
    </NoHydration>
  );
}