Working with Virtual DOM, Reconciliation, Diffing Algorithms

What is Virtual DOM?

  • Virtual DOM is an in-memory representation of the real DOM. It is a concept utilized by React to prevent unnecessary updates to the real/actual DOM after every change as updates to the actual DOM are pretty expensive, performance wise.
  • Virtual DOM is essentially a node tree made out of React Components. It is created when React’s render() function executes. This node tree lists the DOM elements, their attributes and contents as Objects and properties.
  • Whenever there is change in the data(state/props) of the existing node tree i.e Virtual DOM, React creates a new Virtual DOM to incorporate these changes. If…

It’s been a while since I posted any blog. Mainly due to lack of time from my job. But I’d like to make that up by providing some valuable insight. Today, we’re gonna look behind the scenes of how a JavaScript Engine works. This post assumes basic familiarity of JavaScript, on the reader’s end. Also, familiarity with concepts of asynchronous code execution would be handy. You could take a look at this article for a basic idea on async code. This post is for JavaScript developers, both novice and experienced,who want to understand such advanced concepts of JavaScript.

What is a JavaScript Engine??

A JavaScript…


An attempt(calling this an attempt because I was scared and confused as heck when I first got into Redux, but things got easier over time with experience and practice) to make novice React Developers understand working with Redux for global state management

This article assumes familiarity with JavaScript(ES5 and ES6+) concepts like Arrow functions, map, rest & spread operators, etc on the reader’s end. It also assumes basic familiarity with ReactJS concepts on the reader’s end like JSX, Class Based Components, Component States, PropTypes, Lifecycle methods like componentDidMount(), componentWillReceiveProps() etc. Also, REST API basic understanding is assumed on the part of the reader.

What is Redux?

Redux, essentially, is a third party library, used mostly in conjunction with ReactJS ,which helps us to manage a global state for an application. In larger ReactJS apps, Redux is not only an optimal solution, but often a necessary…


Scheduling techniques in JavaScript to understand execution of asynchronous code — synchronous vs asynchronous code

Synchronous and Asynchronous code

At it’s core, JavaScript is single threaded and code execution in JavaScript is synchronous, i.e: sequential execution of code. A latter block of code is executed only when a former block of code finishes execution. However, this might lead to certain problems for developers, especially when they’re expecting a result from a certain block of code which might take some time.

For instance, when they make AJAX requests to a server. It might take about half a second to get a response from the server. In such a scenario, the developer might get incorrect or no response if the code…

Sayan Sarkar

Full Stack Developer at Pursuit Software, Kolkata. https://github.com/Sayan3sarkar

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store