---
title: "Lazy loading react components with dynamic imports and intersection observer"
url: https://daily.dev/posts/lazy-loading-react-components-with-dynamic-imports-and-intersection-observer-wujnecshu
source_url: https://dev.to/sidv93/lazy-loading-react-components-with-dynamic-imports-and-intersection-observer-24mh
type: article
source: "DEV"
published: 2021-08-14T08:03:22.219Z
updated: 2021-10-07T14:17:10.317Z
tags: ["general-programming", "react", "webdev"]
reading_time: 3
upvotes: 45
comments: 1
language: en
---

> ## Documentation Index
> Fetch the complete documentation index at: https://daily.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# Lazy loading react components with dynamic imports and intersection observer

**[DEV](https://daily.dev/sources/devto)** · 3 min read · 45 upvotes · 1 comments

## Summary

Lazy loading is a way by which we can load content only when they are needed. This is achieved by code-splitting, where we split our app into multiple chunks. The idea here is to serve the user with only the content they can view, and serve the other contents as and when the user visits them.

## Full article

daily.dev links to this article rather than hosting it. Read it at the original source: <https://dev.to/sidv93/lazy-loading-react-components-with-dynamic-imports-and-intersection-observer-24mh>

## Community discussion

Top comments from developers on daily.dev.

**@hrdaniels** · 0 upvotes

> Thanks for sharing your knowledge  (/^▽^)/

## Similar posts on daily.dev

- [Don’t just attend KubeCon \+ CloudNativeCon, Merge Forward your experience\!](https://daily.dev/posts/don-t-just-attend-kubecon-cloudnativecon-merge-forward-your-experience--l0rpp73x8) · CNCF · 0 upvotes · 0 comments
- [Announcing H2 2026 KCDs](https://daily.dev/posts/announcing-h2-2026-kcds-m96goajm1) · CNCF · 1 upvotes · 0 comments
- [Two months of Open Community Groups](https://daily.dev/posts/two-months-of-open-community-groups-asf52zhbs) · CNCF · 0 upvotes · 0 comments

---

Tags: [#general-programming](https://daily.dev/tags/general-programming), [#react](https://daily.dev/tags/react), [#webdev](https://daily.dev/tags/webdev)

[View this post on daily.dev](https://daily.dev/posts/lazy-loading-react-components-with-dynamic-imports-and-intersection-observer-wujnecshu)