<NoHydration>

The <NoHydration> component prevents the client-side hydration process from being applied to its children. During server-side rendering, components and elements wrapped within <NoHydration> will render normally on the server, contributing to the initial HTML output. However, during client-side hydration, Solid bypasses the hydration process for the content within <NoHydration>. This means that elements within <NoHydration> will not have event listeners attached by Solid, and their state will not be managed reactively on the client-side after the initial render.

Example

import { NoHydration } from "solid-js/web";
import { InteractiveComponent, StaticContent } from "./components";

function Example() {
  return (
    <div>
      <InteractiveComponent />
      <NoHydration>
        <StaticContent />
      </NoHydration>
    </div>
  );
}