---
title: "Discussion on \"What is Reconciliation? How to create our own Reconciler?\" | Hashnode"
description: "Discussion on \"What is Reconciliation? How to create our own Reconciler?\". What is Document Object Model? What is Virtual DOM? What is diffing?"
url: "https://hashnode.com/posts/what-is-reconciliation-how-to-create-our-own-reconciler/649b1cef1d94d1a645fb8107"
---

[Feed](https://hashnode.com/feed) /

Discussion

# [What is Reconciliation? How to create our own Reconciler?](https://rishabhsinghcodes.hashnode.dev/what-is-reconciliation-how-to-create-our-own-reconciler?utm_source=hashnode&utm_medium=feed)

What is Document Object Model? What is Virtual DOM? What is diffing?

Jun 27, 2023 · 8 min read · rishabhsinghcodes.hashnode.dev  
Updated Jul 3, 2023  
Read the article

-   [#reconcilliation](https://hashnode.com/tag/reconcilliation)
-   [#javascript](https://hashnode.com/tag/javascript)
-   [#reactjs](https://hashnode.com/tag/reactjs)
-   [#vuejs](https://hashnode.com/tag/vuejs)

## Written by

[Rishabh Singh](https://hashnode.com/@rishabhsinghcodes)

@rishabhsinghcodes

  
[View profile](https://hashnode.com/@rishabhsinghcodes)

Full Stack Developer

Full Stack Developer

## Responses 4

Markdown supported · ⌘↵ to post

[Avradip Das](https://hashnode.com/@avradip08)

[Jun 30, 2023](https://hashnode.com/posts/what-is-reconciliation-how-to-create-our-own-reconciler/649b1cef1d94d1a645fb8107/comment/649e4fc82a0936ab01ee15f7)

Amazing work man.

Here are a few suggestions :

i. you should use a counter as the id of the blocks and increment it whenever a new block is created, because whenever elements are deleted from the beginning, the `block${blocks.length + 1}` sets the id of the new block with an id which could already be there in the array. suppose, block.length = 2, currently block ids are : block1, block2 if you delete block1, block.length=1, if you insert again, the new id will be block${1 + 1}\`-> block2, which already exists.

ii. whenever re-rendering the components you can use a setTimeout for each component render, so that paint flashing can be seen slowly.

[Rishabh Singh](https://hashnode.com/@rishabhsinghcodes)

[Jun 30, 2023](https://hashnode.com/posts/what-is-reconciliation-how-to-create-our-own-reconciler/649b1cef1d94d1a645fb8107/comment/649e4fc82a0936ab01ee15f7#reply-649ef0cb5b8c3caad1789078)

Hey Avradip, thanks for these amazing suggestions. I have updated the reconciler and the code in the blog with these changes. I also updated the block shape to make the re-rendered portion more visible.

[Aryan Sharma](https://hashnode.com/@aryan013)

[Jun 29, 2023](https://hashnode.com/posts/what-is-reconciliation-how-to-create-our-own-reconciler/649b1cef1d94d1a645fb8107/comment/649d6f755530caa57e09561b)

loved this ! will look forward to more of this amazing stuff from your side

[Rishabh Singh](https://hashnode.com/@rishabhsinghcodes)

[Jun 29, 2023](https://hashnode.com/posts/what-is-reconciliation-how-to-create-our-own-reconciler/649b1cef1d94d1a645fb8107/comment/649d6f755530caa57e09561b#reply-649d93fb5530caa57e095bab)

Thank you Aryan. This motivates me to write more.

[Swapnil Pant](https://hashnode.com/@swapn652)

[Jun 28, 2023](https://hashnode.com/posts/what-is-reconciliation-how-to-create-our-own-reconciler/649b1cef1d94d1a645fb8107/comment/649c07c2b4f39088739261c4)

Amazing blog man. Learned something new today.

[Rishabh Singh](https://hashnode.com/@rishabhsinghcodes)

[Jun 28, 2023](https://hashnode.com/posts/what-is-reconciliation-how-to-create-our-own-reconciler/649b1cef1d94d1a645fb8107/comment/649c07c2b4f39088739261c4#reply-649c42eec3c45b9868c82480)

Glad to know that Swapnil 😃

[Swapnil Pant](https://hashnode.com/@swapn652)

[Jun 29, 2023](https://hashnode.com/posts/what-is-reconciliation-how-to-create-our-own-reconciler/649b1cef1d94d1a645fb8107/comment/649c07c2b4f39088739261c4#reply-649d153c2f8474a27dd5c8c4)

[Rishabh Singh](https://hashnode.com/@rishabhsinghcodes), I even shared your blog on Twitter, but didn't know your id, so couldn't tag you.

[Nishchit Malasana](https://hashnode.com/@0xNishchit)

[Jun 28, 2023](https://hashnode.com/posts/what-is-reconciliation-how-to-create-our-own-reconciler/649b1cef1d94d1a645fb8107/comment/649bcbb6b4f3908873925862)

noice man

[Rishabh Singh](https://hashnode.com/@rishabhsinghcodes)

[Jun 28, 2023](https://hashnode.com/posts/what-is-reconciliation-how-to-create-our-own-reconciler/649b1cef1d94d1a645fb8107/comment/649bcbb6b4f3908873925862#reply-649c4301c3c45b9868c82486)

Thank you Nishchit
