What are web workers in JavaScript? Explained with a real-world example. — JavaScript is a single-threaded programming language. That means everything happens on that single main thread. It can’t do multiple things at the same time. Web workers were introduced to solve this issue. Web workers give us the possibility to write multi-threaded JavaScript, which does…

The call(), apply() and bind() methods are used for function borrowing in JavaScript. It means that by using them, we can use the methods of one object on a different object without having to make a copy of that method and maintain it in two separate places. Let’s say we…

dangerouslySetInnerHTML is an attribute under DOM elements in React. According to the official documentation, dangerouslySetInnerHTML is React’s replacement for using innerHTML in the browser DOM to set HTML programmatically or from an external source. Syntax and Need to use dangerouslySetInnerHTML In simple vanilla JS to insert the HTML into the web page we use innerHTML property…

What is MutationObserver? MutationObserver is a Web API provided by modern browsers for detecting changes in the DOM. Using MutationObserver, when something in the DOM changes, we can invoke a callback function to react to those changes. Why would we even need to do that? There are quite a few cases in which…

An introduction to Jest and React Testing Library for beginners. — React testing library has become the most popular option to write test cases for React applications. These test cases resemble how a user would use your application. If you are using the latest version of the create-react-app tool then you already have Jest and Testing Library already installed for you.

The term Skeleton Loading Animation may seems new but it is something that you have seen on almost every popular platform (eg. Facebook, Youtube, LinkedIn etc). When the site content is taking time to load due to slower Network, we used to see a loading icon/gif which indicates that the…

The term Skeleton Loading Screens may seem new but it is something that you have seen on almost every popular platform (eg. Facebook, YouTube, LinkedIn, etc). These are animated placeholders for the information that is still loading. It mimics the structure and look of the entire view. When the site…