Lazy Loading
Last updated
What is Lazy Loading?
Lazy loading in Next.js helps improve the initial loading performance of an application by decreasing the amount of JavaScript needed to render a route. It allows you to defer loading of Client Components and imported libraries, and only include them in the client bundle when they're needed. For example, you might want to defer loading a modal until a user clicks to open it.
Free resources to learn Lazy Loading
- Official docsHow to lazy load Client Components and libraries
- ArticleLazy loading
More in stage 27: Setting things Up
Lazy Loading: common questions
Can I learn Lazy Loading in Hindi?
This lesson is written in English. Once you sign in, open it in the interactive course and ask the AI tutor to explain Lazy Loading in Hindi or Hinglish. The tutor answers from this lesson’s own text, so it stays on the syllabus, and it runs on your own Google, OpenAI or Anthropic key.
Is this Lazy Loading tutorial for beginners?
It is lesson 74 of 94 in the free Next.js roadmap, in stage 27, Setting things Up. If you are new to Next.js, start from stage 1 and come back here in order; if you already know the earlier stages, this lesson stands on its own.