skills.rest
matthewharwood
matthewharwoodCOMMUNITY
Explore all skills by this author →
GitHub

tanstack-router-preload

Define and enforce TanStack Router preload policies with defaultPreload and per-link overrides.

1|Updated Apr 26, 2026
Search Tags:#spa#preload#tanstack-router#route-loader#modulepreload
One-click install
npx skills add https://github.com/matthewharwood/dean-stack --skill tanstack-router-preload
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: tanstack-router-preload
Source: https://github.com/matthewharwood/dean-stack/tree/main/.claude/skills/tanstack-router-preload
Command: npx skills add https://github.com/matthewharwood/dean-stack --skill tanstack-router-preload

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Centralizes and enforces the TanStack Router preload policy for dean-stack, ensuring consistent defaultPreload and per-link preload behavior across the SPA and prerendered outputs.

Core Features & Use Cases

  • Defines defaultPreload: "intent" and the per-link preload override policy to optimize initial navigation and loader execution.
  • Documents relationships with Workbox precaching and the router API for coherent preload semantics.
  • Use Case: Aligns route preload behavior across all apps/web routes to improve perceived performance and offline readiness.

Quick Start

Configure the defaultPreload policy in getRouter() and apply per-link preload overrides for critical links.

Frequently Asked Questions about tanstack-router-preload

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I configure TanStack Router defaultPreload behavior for an SPA?▼

Configure TanStack Router defaultPreload behavior by setting the defaultPreload policy to "intent" within your getRouter() function, ensuring consistent route preloading and optimized loader execution across your SPA.

Can I override TanStack Router preload settings on a per-link basis?▼

Yes, you can apply per-link preload overrides in TanStack Router to customize preload behavior for critical links, allowing individual link configurations to take precedence over the centralized defaultPreload policy.

Does TanStack Router preload policy work with Workbox precaching?▼

TanStack Router preload policy coordinates with Workbox precaching to maintain coherent preload semantics, ensuring route preloading aligns with service worker caching to improve perceived performance and offline readiness.

Why does route preloading behave differently on iPad touchstart events?▼

Route preloading accounts for iPad touchstart behavior by adapting the defaultPreload "intent" policy to touch interactions, ensuring navigation and loader execution trigger appropriately for mobile device events.

What is the best way to centralize TanStack Router preload configuration across multiple routes?▼

The best way to centralize TanStack Router preload configuration is to define a single preload policy in router.tsx that governs defaultPreload settings and per-link overrides, ensuring consistent preload behavior across all routes.

Does route preloading affect prerendered output in TanStack Router?▼

Yes, TanStack Router preloading applies to prerendered output, ensuring that the defaultPreload policy and per-link overrides maintain consistent preload semantics across both runtime SPA navigation and statically prerendered routes.

Related Skills

Explore More Software Engineering Skills→
matthewharwoodmatthewharwood
1

tanstack

Route TanStack Start questions to the appropriate sub-skill.

Community
Advanced
matthewharwoodmatthewharwood
1

tanstack-router-pwa-deep-links

Serve a prerendered SPA shell for offline deep-link navigation with TanStack Router.

Community
Advanced
nklischnklisch
7

tanstack-router-v1

Reference TanStack Router v1 APIs for file-based routing and navigation.

Community
Basic
alexander-kastilalexander-kastil

angular-routing

Configure Angular routing with lazy loading, guards, resolvers, and signal-based parameters.

Community
Advanced