Learn the core difference between these two rendering methods and when to use each.
Scroll Down to LearnBuild Time Rendering
Request Time Rendering
Static Site Generation (SSG) means your page is generated at build time. Once built, it's served as static HTML, making it extremely fast and CDN-friendly.
Perfect for: Blogs, documentation, marketing pages.
SSR means the page is rendered on the server every time a request is made.
It ensures your users always see the latest data but adds some server load and response time.
Perfect for: Dashboards, authenticated pages, dynamic feeds.
Let's compare the key differences between Static Site Generation and Server-side Rendering.
Making the right choice for your specific use case can significantly impact performance and user experience.
Your content doesn't change often
Like marketing websites, documentation, or blogs.
Page performance is critical
Static pages load faster and improve SEO metrics.
You want lower hosting costs
Static sites can be hosted on CDNs at minimal cost.
You don't need user-specific content
Same content shown to all visitors.
You need dynamic content
Like real-time data dashboards or social feeds.
User-specific personalization is required
Such as authenticated portals or user dashboards.
Content updates frequently
And needs to be immediately visible to users.
Request-based information is needed
Like user location, cookies, or authentication state.
Next.js allows you to mix both methods! Use SSG for static pages and SSR for dynamic ones, all in the same project.
Implementing these rendering methods is straightforward with Next.js API functions.
export async function getStaticProps() {
// Fetch data at build time
const res = await fetch('https://api.example.com/data');
const data = await res.json();
return {
props: {
data
},
// Optional: Revalidate every 60 seconds
revalidate: 60
}
}revalidate for incremental static regenerationexport async function getServerSideProps(context) {
// Fetch data at request time
const { req, query } = context;
const res = await fetch(
`https://api.example.com/data?userId=${query.userId}`
);
const data = await res.json();
return {
props: {
data
}
}
}
context)Mix and match in the same app
Different pages can use different rendering methods.
Incremental Static Regeneration (ISR)
Use the revalidate property for the best of both worlds.
Client-side fetching
Combine with SWR or React Query for dynamic data.
Dynamic routes
SSG requires getStaticPaths for dynamic routes.
Find answers to commonly asked questions about our coding courses.
No prior experience is needed for our beginner courses. We start from the absolute basics and gradually progress to more advanced concepts. For intermediate and advanced courses, we recommend having the prerequisite knowledge mentioned in the course description.
Once you purchase a course, you have lifetime access to all course materials, updates, and the community forum related to that course. We regularly update our content to keep it relevant with the latest industry standards.
Yes, we offer a 30-day money-back guarantee. If you're not completely satisfied with your purchase, you can request a full refund within 30 days of enrollment. No questions asked.
Most courses require about 4-6 hours per week to complete in a reasonable time frame. However, our platform is self-paced, so you can learn according to your own schedule. Each course indicates the estimated completion time in the description.
Yes, all courses come with a certificate of completion that you can add to your resume or LinkedIn profile. For some advanced courses, we also offer industry-recognized certifications upon passing the final assessment.
You'll have access to our community forum where you can ask questions and get help from instructors and fellow students. Premium courses include direct mentor support, code reviews, and weekly live Q&A sessions.
Access our free tutorials, coding challenges, and community projects to supplement your learning.
Browse ResourcesStay updated with the latest programming trends, tips, and industry insights from our expert instructors.
Read Blog