{
  "slug": "sveltekit-server-and-universal-load",
  "version": 1,
  "project": "sveltekit",
  "title": "SvelteKit server and universal load data during SSR and hydration",
  "description": "Server load data feeds universal load during SSR and is serialized into the initial HTML. The browser passes that original server data to universal load again during hydration, reusing captured fetch responses. The page receives the universal load result.",
  "config": {
    "design": "architecture-grouped-panels-region-boundary-logo-nodes",
    "name": "server-and-universal-load",
    "style": "clean",
    "palette": [
      "#a36548"
    ],
    "accessibility": {
      "title": "SvelteKit server and universal load data during SSR and hydration",
      "description": "Server load data feeds universal load during SSR and is serialized into the initial HTML. The browser passes that original server data to universal load again during hydration, reusing captured fetch responses. The page receives the universal load result."
    },
    "parameters": {
      "groups": [
        {
          "name": "Server",
          "description": "Initial server-side render"
        },
        {
          "name": "Browser",
          "description": "Hydration of the same page"
        }
      ],
      "nodes": [
        {
          "id": "server",
          "label": "+page.server.js",
          "description": "Server load result",
          "icon": "tabler:server",
          "group": "Server"
        },
        {
          "id": "universal-server",
          "label": "+page.js",
          "description": "Universal load during SSR",
          "icon": "tabler:code",
          "group": "Server"
        },
        {
          "id": "html",
          "label": "SSR output",
          "description": "Page HTML + fetch responses",
          "icon": "tabler:file-code",
          "group": "Server"
        },
        {
          "id": "server-data",
          "label": "Server load result",
          "description": "Deserialized from HTML",
          "icon": "tabler:braces",
          "group": "Browser"
        },
        {
          "id": "universal-browser",
          "label": "+page.js",
          "description": "Universal load at hydration",
          "icon": "tabler:code",
          "group": "Browser"
        },
        {
          "id": "page",
          "label": "+page.svelte",
          "description": "Hydrates with universal data",
          "icon": "tabler:browser",
          "group": "Browser"
        }
      ],
      "edges": [
        {
          "from": "server",
          "to": "universal-server"
        },
        {
          "from": "universal-server",
          "to": "html"
        },
        {
          "from": "server",
          "to": "server-data"
        },
        {
          "from": "html",
          "to": "universal-browser"
        },
        {
          "from": "server-data",
          "to": "universal-browser"
        },
        {
          "from": "universal-browser",
          "to": "page"
        }
      ]
    }
  },
  "files": {
    "svg": {
      "url": "/diagram-sources/sveltekit-server-and-universal-load/v1/diagram.svg",
      "sha256": "d566ebd259e8908a4cc267f6e7361acfd1f9d82c341e968bab8ea2e7e42842ec"
    },
    "png": {
      "url": "/diagram-sources/sveltekit-server-and-universal-load/v1/diagram.png",
      "sha256": "615c233a424644c52390fe210e6f5c5cca3e83eeec2a14bd18a2cac4c76e003d"
    }
  }
}