Loading Data

DinoSsr is an experimental work in progress and subject to change!

Svelte routes can export a load function from the module script. This function is used to fetch and add context data for the current page.

<script context="module">
  export const pattern = '/:id(\d+)/';

  export function load ({params, fetch, publicData}) {
    const response = await fetch(`https://example/api/${params.id}`);
    const data = response.json();
    publicData.user = {
      name: `${data.firstName} ${data.lastName}`

Child components do not have a load function but they can access the same global context for the page they’re used.

The load function receives an object with the properties:


An object of any URL Pattern matches.


A function that proxies the global fetch allowing relative URLs to be handled by middleware and not remotely. URLs prefixed with ORIGIN are also handled internally (see environment variables).


An object to read and assign context data.


An object to read and assign context data.

Advanced Properties

Properties from platform in advanced routes are also available.

Return value

The load function can return an optional Response. This replaces the Svelte template which is never rendered.