First contentful paint (FCP) marks the time when browser renders some content for the given document. FCP can be captured in native JavaScript using PerformanceObserver & Paint Timing API.

This article describes how usefulangle.com improved the LCP web vital metric when there was a hero image in the page.

A possible way of detecting adblockers is to listen to the onerror event of the ad serving script element. If the script fails to load, probably it has been blocked by an adblocker.

Input fields inside a form can be retrieved as a query string using FormData & URLSearchParams objects.

Multiple Javascript files can be loaded dynamically and executed in a given order by creating script element for each of them, and inserting them to the DOM in order of their intended execution.

Properties and methods be changed for a const object. It just means that the variable identifier cannot be reassigned.

Events can be removed in Javascript using the removeEventListener() method. However few other things need to be done in order to remove the event successfully

Events can be added to multiple elements that are selected by class by looping through the list of elements and registering event for each element individually.

This tutorial explains how to create a Google Chrome extension that will navigate through a list of given URLs, and save data from each page to a file.

One-time executing events can be created by setting the once option as parameter to addEventListener() method.

To ensure only a single new tab or window is created for several links in the page, the same child attribute needs to set for all the links.

This tutorial explains how to measure site analytics (page views & bounce rate) using custom Javascript, rather than using third party analytics libraries.

This tutorial explains how to measure site analytics (sessions) using Javascript, rather than using third party analytics libraries.

The logical nullish assignment operator (??=) works like the assignment operator (=) but assigns only when the left-hand side is a nullish value.

The logical AND assignment operator represented by &&= works like the assignment operator (=), but assigns only when the left-hand side is a truthy value.

The logical OR assignment operator (||=) works like the assignment operator (=), but assigns only when the left-hand side is a falsy value.

Javascript provides multiple methods that can check whether a sub-string is contained in a string, depending on various possible use-cases.

The new.target property can be used to detect whether a function was invoked as a constructor using the new operator, or just called normally.

Currently it is not possible to get file upload progress for fetch. The alternate solution for now is to use XMLHttpRequest.

Checking whether an element is visible or hidden in the full page, even through it may not be in screen view, can be done through an Intersection Observer. The trick is to set the root element to document.documentElement.