Skip to content
Houdini Docs

Links and Preloading

Links between pages are defined using standard <a> tags.

Preloading

You can opt-into preloading links on a case by case basis by adding data-houdini-preload:

<a href="/shows" data-houdini-preload>

Houdini will detect when the user hovers over this element and fetch whatever is necessary to render the page before they click on the link. By default, this means loading both the page component source as well sending the actual query.

You can customize this by setting the prop to one of 3 values:

  • "data": only request the page’s data
  • "component": only request the page’s component source
  • "page": request all of the assets for the page. This is the default.

For example,

<a href="/shows" data-houdini-preload="data">