Fl-App Router tieħu d-data direttament ġewwa async Server Components billi tuża l-API standard fetch — ebda getServerSideProps, ebda useEffect, ebda data layer separat. Next.js testendi fetch b'kontrolli tal-caching.
// app/posts/page.tsx — a Server Component
export default async function Posts() {
const res = await fetch("https://api.example.com/posts"); // runs on the server
const posts = await res.json();
return <ul>{posts.map(p => <li key={p.id}>{p.title}</li>)}</ul>;
}
Bħal il-komponent jimxu fuq is-server, sempliċiment await id-data tiegħek u ġibha — ħafna aktar sempliċi mill-useEffect + useState + loading-state tal-naħa tal-client.
Next.js testendi fetch sabiex kull sejħa tagħżel il-imġiba tar-rendering tagħha:
fetch(url, { cache: "force-cache" }); // SSG — cached (default for static)
fetch(url, { cache: "no-store" }); // SSR — fresh every request
fetch(url, { next: { revalidate: 60 } }); // ISR — revalidate every 60s
fetch(url, { next: { tags: ["posts"] } }); // tag for on-demand revalidation
Da huwa l-mudell unifikat tal-App Router: minflok tagħżel strateġija tal-livell tal-paġna, inti tikkontrolla l-caching fil-livell tal-data-fetch.
// ❌ sequential — each awaits the previous (slow waterfall)
const user = await getUser();
const posts = await getPosts();
// ✅ parallel — both start at once
const [user, posts] = await Promise.all([getUser(), getPosts()]);
Ibda riċjesti indipendenti flimkien b' Promise.all sabiex ma jblokkawhx lil xulxin.
"use client";
// for client-side data (e.g. after interaction), use a library like SWR or React Query
const { data } = useSWR("/api/user", fetcher);
Is-Server Components jkopru l-ħtieġ tal-ħafna; għal data tal-client-side, interattiva, jew li tirrikjedi validazzjoni spissa, uża SWR/React Query.
Next.js awtomatikament deduplica sejħat fetch identiċi f'rendering wieħed — allura tista' tieħu d-data ذat ذ istess f'layout u paġna mingħajr riċjesta doppja.
Il-fetching dirett ta' data async fl-Server Components hija waħda mill-akbar simplifikazzjonijiet tal-App Router — ebda boilerplate, aċċess sigur server-side, deduping awtomatiku, u caching per-fetch li jaħdem doppju bħala l-għażla tiegħek SSG/SSR/ISR.
Il-għarfien ta' kif teparallizza fetches indipendenti (evita l-cascades) hija l-prattika tal-prestazzjoni ewlenija.
Librerija ta' mistoqsijiet ta' intervisti tal-IT b'tweġibiet dettaljati — minn Junior sa Senior.
Iddona