2022-08-16
2538
#react
Ibadehin Mojeed
127976
Aug 16, 2022 ⋅ 9 min read

What is the virtual DOM in React?

Ibadehin Mojeed I'm an advocate of project-based learning. I also write technical content around web development.

Recent posts:

Exploring The Javascript Registry For Javascript Module Management

Exploring JSR for JavaScript module management

JSR is designed to serve as a registry for both JavaScript and TypeScript packages, and an upgrade to the features provided by npm.

Oyinkansola Awosan
Jul 19, 2024 ⋅ 8 min read
Error Handling In Rust A Comprehensive Guide

Error handling in Rust: A comprehensive tutorial

Learn to handle Rust errors efficiently to write cleaner, more maintainable Rust code and create a more user-friendly application.

Eze Sunday
Jul 18, 2024 ⋅ 10 min read
Exploring Actions And Request Rewriting In Astro

Exploring actions and request rewriting in Astro

Astro v4.8 ships with server actions and request rewriting. Let’s see how to use these long-awaited (though still experimental) features.

Ivaylo Gerchev
Jul 17, 2024 ⋅ 13 min read
Comparing Fiber Vs Gin For Go Web Development

Comparing Fiber vs. Gin for Go web development

Go Fiber and Gin are two popular Go frameworks that provide extensive toolkits for developing high-performance apps with modern features.

Temitope Oyedele
Jul 17, 2024 ⋅ 8 min read
View all posts

6 Replies to "What is the virtual DOM in React?"

  1. Thank you for the great article it helped me understand the concept of real & virtual DOM through such amazing examples & illustrations.

    A summary of my understanding is that the main DOM is a tree structure of all the elements in the HTML page. When there’s changes in the UI, re-rendering the whole page is costly so in react there’s the concept of virtual DOM where in memory objects are used to keep track of the changes in UI. React uses reconciliation (a diffing algo to compare the snapshots of the virtual DOM tree) & ReactDOM library to update the actual DOM.

  2. Why use all this HTML in JS code? If we can render only the element where the clock will be. The Form is a separate component. The example does not contain anything useful

Leave a Reply