+page.js load Function
Export a load function to fetch or compute data before the page renders.
+page.js load Function is a free Sveltejs Academy lesson on CoddyKit — lesson 1 of 4. You can read the complete lesson below for free — then practise it hands-on in the browser with a built-in code editor and a 24/7 AI tutor. It is part of the Sveltejs Academy learning path, one of 4 lessons in the course, and your progress syncs across the web and the CoddyKit app.
Why Load Functions
SvelteKit needs to know what data your page needs so it can fetch before render. The load function provides it.
File Location
Create +page.js next to +page.svelte in the same folder.
Export load
Export a function named load.
export async function load({ params, fetch }) {
const res = await fetch("/api/items");
return { items: await res.json() };
}Async Allowed
Load functions can be async. SvelteKit awaits them before rendering.
Returned Data
Whatever you return is provided as the data prop to the page.
Use fetch
Use the fetch provided to the load function. It handles SSR and credentials correctly.
Accessing params
Dynamic route params live on params.
export function load({ params }) { return { slug: params.slug }; }Runs Server-Side First
For initial requests, load runs on the server; for subsequent navigations, on the client.
Universal vs Server-Only
+page.js runs both places; +page.server.js runs only on the server.
Caching
Use HTTP headers and the platform cache to make load functions efficient.
Streaming
Return promises in nested properties to stream data without blocking initial HTML.
Quick Check
What does load return?
Recap
Export load from +page.js to fetch or compute data. The return becomes the page's data prop.
Frequently asked questions
Is the “+page.js load Function” lesson free?
Yes — the full text of “+page.js load Function” is free to read here on the web, and the Sveltejs Academy course includes 4 lessons in total. To practise it interactively (a built-in code editor and a 24/7 AI tutor) and unlock the rest of the Sveltejs Academy course, upgrade to CoddyKit PRO.
What will I learn in “+page.js load Function”?
Export a load function to fetch or compute data before the page renders. You practise Sveltejs Academy with hands-on code you run directly in the browser, and a 24/7 AI tutor answers your questions as you work through the lesson.
Do I need any experience to start Sveltejs Academy?
No prior experience is required. Sveltejs Academy on CoddyKit is structured for beginners through advanced learners; this is — lesson 1 of 4, so you can start here or from the beginning and move at your own pace.
How long does the “+page.js load Function” lesson take?
Most CoddyKit lessons take about 5–10 minutes. Each one is bite-sized and interactive, so you make steady progress and pick up exactly where you left off across the web and the app.
Can I write and run code in this Sveltejs Academy lesson?
Yes. Every Sveltejs Academy lesson includes a built-in code editor, so you write and run real code right in your browser and get instant AI feedback — no local setup required.