{
  "id": "3bda2219480027d07afd1520",
  "source": "solid:signals",
  "type": "github-document",
  "title": "hydrate",
  "content": "---\ntitle: hydrate\nuse_cases: \u003e-\n  ssr hydration, client initialization, server-rendered apps, spa startup, dom\n  rehydration\ntags:\n  - hydration\n  - ssr\n  - rendering\n  - initialization\n  - dom\nversion: '1.0'\ndescription: \u003e-\n  Hydrate server-rendered HTML with SolidJS client-side code. Essential for\n  initializing SSR applications and attaching interactivity to static HTML.\n---\n\n```ts\nimport { hydrate } from \"solid-js/web\"\nimport type { JSX } from \"solid-js\"\nimport type { MountableElement } from \"solid-js/web\"\n\nfunction hydrate(\n  fn: () =\u003e JSX.Element,\n  node: MountableElement,\n  options?: { renderId?: string; owner?: unknown }\n): () =\u003e void\n\n```\n\nThis method is similar to `render` except that it attempts to rehydrate what is already rendered to the DOM.\nWhen initializing in the browser a page has already been server rendered.\n\n```ts\nconst dispose = hydrate(App, document.getElementById(\"app\"))\n```\n\n## Parameters\n\n| Prop                 | type               | description                                     |\n| -------------------- | ------------------ | ----------------------------------------------- |\n| fn                   | `() =\u003e JSX.Element`| Function that returns the application code.     |\n| node                 | MountableElement   | DOM Element to mount the application to         |\n| options.renderId     | string             |                                                 |\n| options.owner        | unknown            |                                                 |",
  "url": "https://github.com/solidjs/solid-docs/blob/HEAD/src/routes/reference/rendering/hydrate.mdx",
  "metadata": {
    "path": "src/routes/reference/rendering/hydrate.mdx",
    "repo": "solidjs/solid-docs",
    "repo_url": "https://github.com/solidjs/solid-docs.git",
    "size": 1506,
    "source_type": "github"
  },
  "hash": "74cdef4965a0a2ce8597840ae57e2f92b5da064d0c1cd7db28c4d5a20917dd99",
  "timestamp": "2026-02-23T11:43:00.190310326+01:00"
}