Articles tagged "javascript_nitty_gritty":

Module behaviour in browsers - loading waterfalls, module preloading, cache invalidation cascades and import maps.

Browsers now support ESM modules natively - meaning that we no longer need to bundle our modular code. However be aware that naive use of ESM modules may lead to unperformant loading waterfalls. Our options: bundle, use dynamic imports, or preload our modules.

Examples of tooling that do not play nicely with ESM

EcmaScript Modules (ESM) are well established - leading some to argue that we no longer need to provide CJS packages. However, is that really the case?

Two caching strategies

There are generally two strategies for caching, 'cache, but require validation' and 'trust what you've already got without caching'. The latter is well suited for caching static assets.

The behaviour of browsers and loading resources - Scripts

JavaScript scripts can not be evaluated until they have been completely loaded. By default they are parse blocking.

The behaviour of browsers and loading resources - HTML, images, and CSS

Browsers do not need to wait for an entire HTML document to be loaded before it can display it. CSS is render blocking. Images will start streaming as soon as the tag is encountered.