ये पेज के HTML के कब बनाए जाने के लिए तीन मुख्य रणनीतियां हैं। प्रति पृष्ठ सही चुनना ताजापन, प्रदर्शन और सर्वर लागत को संतुलित करता है।
SSG — Static Site Generation (बिल्ड समय पर)
() {
posts = (, { : }).( r.());
;
}
ये पेज के HTML के कब बनाए जाने के लिए तीन मुख्य रणनीतियां हैं। प्रति पृष्ठ सही चुनना ताजापन, प्रदर्शन और सर्वर लागत को संतुलित करता है।
() {
posts = (, { : }).( r.());
;
}
पेज को बिल्ड समय पर स्टेटिक HTML में पहले से रेंडर किया जाता है और CDN पर कैश किया जाता है। सबसे तेज संभव डिलीवरी, लेकिन सामग्री अगली बिल्ड तक फ्रीज़ रहती है। उस सामग्री के लिए सर्वोत्तम जो शायद ही कभी बदलती है: मार्केटिंग पेज, दस्तावेज़, ब्लॉग पोस्ट।
// HTML generated FRESH on every request
export default async function Page() {
const data = await fetch("...", { cache: "no-store" }).then(r => r.json());
return <Dashboard data={data} />;
}
सर्वर हर अनुरोध पर पेज रेंडर करता है, इसलिए डेटा हमेशा वर्तमान होता है — धीमी प्रतिक्रिया और हर यात्रा पर सर्वर लोड की कीमत पर। व्यक्तिगत या हमेशा-ताज़े डेटा के लिए सर्वोत्तम: डैशबोर्ड, खाता पृष्ठ, खोज परिणाम।
// Static, but automatically rebuilt in the background every N seconds
export const revalidate = 60; // regenerate at most once per 60s
export default async function Page() {
const products = await fetch("...", { next: { revalidate: 60 } }).then(r => r.json());
return <Products items={products} />;
}
ISR स्टेटिक HTML (तेज़, CDN-कैश्ड) देता है लेकिन एक शेड्यूल पर पृष्ठभूमि में पुनः सत्यापित करता है — तो आपको स्टेटिक प्रदर्शन मिलता है समय-समय पर ताज़े डेटा के साथ, पूरी साइट को फिर से बनाए बिना। उस सामग्री के लिए सर्वोत्तम जो कभी-कभी बदलती है: पणय सूचियां, समाचार, लीडरबोर्ड।
Speed Freshness Server cost Use for
SSG fastest build-time only none docs, marketing
SSR slower always fresh every request dashboards, personalized
ISR fast every N seconds occasional catalogs, news
App Router में आप कैश विकल्प (force-cache = SSG, no-store = SSR, revalidate = ISR) के माध्यम से प्रति-फेच पर इन्हें चुनते हैं विशेष कार्यों के बजाय।
ट्रेड-ऑफ को समझना — स्टेटिक सबसे तेज़ है लेकिन पुरानी, SSR ताज़ी है लेकिन महंगी, ISR दोनों को संतुलित करती है — आपको प्रदर्शन और डेटा ताजापन के सही मिश्रण के लिए प्रत्येक पेज को अनुकूलित करने देता है।