JavaScript

Cybersecurity / 23 Sep 2026 / 6 min read

Origin-Agent-Cluster Separates Origin-Keyed JavaScript Heaps

Origin-Agent-Cluster Separates Origin-Keyed JavaScript Heaps Web origins that share a site can still belong to different security principals. app.example.com and admin.example.com, for example, have distinct origins even though both sit beneath the same registrable domain. Browser process architecture has historically allowed related origins to share an agent cluster in some cases, which can place their JavaScript execution environments closer together than an origin-only model suggests. The Origin-Agent-Cluster response header gives a document a way to request origin-keyed clustering:

Cybersecurity Browser Security

Web Development / 19 Sep 2026 / 7 min read

Markdown Containers as a Lightweight UI DSL

A content file does not need a component tree to express that one region is a hero, callout, card, or gallery. A small extension to Markdown can carry that intent while ordinary headings, paragraphs, links, and lists remain ordinary Markdown. With markdown-it-container, the author-facing syntax can stay as small as: :::hero # Ship the next release A short description stays normal Markdown. ::: That is already enough to create a lightweight UI DSL: hero has a meaning defined by the application, while the content inside it continues through the Markdown parser. The useful boundary is narrow. Once the format starts exposing rows, columns, padding values, CSS classes, event handlers, and deeply nested components, the content file stops behaving like content and starts becoming source code in another notation.

Web Development Markdown

JavaScript / 19 Sep 2026 / 5 min read

How Node.js Chooses Between .mjs, .cjs, and .js Module Formats

Node.js can execute JavaScript through two module systems: ECMAScript modules (ESM) and CommonJS. The filename is one of the signals that selects between them, which is why files such as postcss.config.mjs appear in projects even when most source files still end in .js. The important detail is that .mjs is not a different JavaScript language. It is an explicit instruction to Node.js: parse and load this file as an ES module.

JavaScript Node.js

JavaScript / 19 Sep 2026 / 4 min read

Axios GET Uses One Config Object for Params and Headers

axios.get() accepts a request URL and one optional configuration object. Query parameters and HTTP headers are not separate positional arguments; they are properties of that configuration object. That boundary matters because code that treats params and headers as independent config arguments either becomes invalid JavaScript or places data where Axios does not read it. The GET method has one config boundary The call shape is: axios.get(url, config) The request configuration can contain several concerns at once:

JavaScript Axios

Cybersecurity / 12 Sep 2026 / 7 min read

Prototype Pollution Turns Object Shape Into Shared State

A configuration object arrives with ordinary JSON fields, passes schema checks for the values the application expects, and is merged into defaults. Later, code in another part of the process reads a property that was never present on its own object. The value still exists. It came through the prototype chain. That separation between the write and its eventual effect is what makes prototype pollution unusually awkward to reason about. The vulnerable operation can look like routine object plumbing: recursive merge logic, path-based assignment, query parsing, or a helper that copies attacker-controlled keys. The security consequence appears only when another component treats inherited state as if it were local, trusted configuration.

Cybersecurity Application Security

JavaScript / 02 Sep 2026 / 6 min read

JavaScript Property Descriptors with Object.defineProperty

Most JavaScript properties are created with assignment or object literals. That is usually the right choice, but it hides several controls that every property carries: whether the property can be assigned, whether common enumeration APIs expose it, and whether its definition can later be changed. Property descriptors make those controls explicit. They are useful for library APIs, metadata, computed properties, compatibility layers, and cases where ordinary assignment exposes more behavior than intended.

JavaScript Objects

JavaScript / 02 Sep 2026 / 4 min read

Deep Cloning in JavaScript with structuredClone

Copying JavaScript objects looks simple until values contain nested arrays, dates, maps, sets, typed arrays, or circular references. A shallow spread copies only the first level, while the old JSON.stringify and JSON.parse pattern changes or rejects several legitimate JavaScript values. structuredClone provides a standard deep-cloning operation based on the structured clone algorithm used by browser messaging APIs. Shallow copies keep nested references A spread expression creates a new outer object:

JavaScript structuredClone

JavaScript / 02 Sep 2026 / 4 min read

Async Iteration and Backpressure with for await...of

JavaScript promises represent one future result. Many systems produce a sequence of future results instead: paginated records, stream chunks, queue messages, or events from an asynchronous source. Async iteration models that shape directly. An async iterable exposes values over time, and for await...of consumes them one at a time. A minimal async generator An async generator can yield values after asynchronous work: async function* pages() { for (let page = 1; page <= 3; page++) { const response = await fetch(`https://example.com/api/items?page=${page}`); if (!response.ok) { throw new Error(`HTTP ${response.status}`); } yield await response.json(); } } for await (const page of pages()) { console.log(page); } The consumer does not need to know how pagination is implemented. It only sees an asynchronous sequence.

JavaScript Async Iteration

JavaScript / 01 Sep 2026 / 3 min read

Use structuredClone for Safe Deep Copying in JavaScript

Copying JavaScript values is easy until nested objects, dates, maps, sets, binary data, or circular references appear. The common JSON round trip works only for a limited subset of values and silently changes some data. The built-in structuredClone() API provides a defined deep-cloning algorithm for many JavaScript data types. Spread syntax is only a shallow copy Object spread copies the first level: const original = { profile: { name: "Ada" } }; const copy = { ...original }; copy.profile.name = "Grace"; console.log(original.profile.name); // "Grace" Both objects still reference the same nested profile. Spread syntax is useful when shallow copying is intentional, but it is not a general deep-copy mechanism.

JavaScript Web APIs

JavaScript / 01 Sep 2026 / 3 min read

Use JavaScript Import Maps for Browser Module Aliases

Native ES modules normally require browser-resolvable URLs such as ./math.js or /vendor/lib.js. Import maps add a controlled indirection layer so application code can use stable bare specifiers such as app/config without a bundler rewriting imports. Define a map before modules load <script type="importmap"> { "imports": { "app/": "/js/app/", "vendor-utils": "/vendor/utils-v3.js" } } </script> <script type="module" src="/js/main.js"></script> Then /js/main.js can use:

JavaScript Import Maps

Web Development / 01 Sep 2026 / 5 min read

Progressive Enhancement for Resilient Web Forms

A web form does not need JavaScript to submit data. That native capability is a useful reliability baseline. Progressive enhancement starts with semantic HTML and a server endpoint that can complete the operation, then adds JavaScript for faster feedback or richer interactions. If the enhancement fails, the core task still has a path to succeed. This approach is valuable even in highly interactive applications because JavaScript can fail for ordinary reasons: slow networks, stale cached chunks, browser extensions, runtime exceptions, or a partial deployment.

Web Development HTML

JavaScript / 01 Sep 2026 / 5 min read

Choosing JavaScript Promise Combinators: all, allSettled, any, and race

JavaScript provides several Promise combinators that look similar but encode very different failure policies. Choosing between Promise.all, Promise.allSettled, Promise.any, and Promise.race is less about syntax and more about defining what “success” means for a group of asynchronous operations. The important question is not “which one runs in parallel?” Promises usually start when you create them. The combinator decides how to observe their outcomes. Promise.all: every result is required Use Promise.all when the operation is successful only if every input fulfills.

JavaScript Promises

JavaScript / 01 Sep 2026 / 5 min read

Cancel Fetch Requests and Prevent Stale UI Updates with AbortController

Fast user interfaces frequently start requests that become irrelevant before they finish. A search box may issue a request for ca, then cat, then catalog. If the oldest request finishes last, it can overwrite the newest results. AbortController gives JavaScript a standard way to cancel Fetch requests and other APIs that accept an AbortSignal. The basic cancellation pattern Create a controller and pass its signal to fetch: const controller = new AbortController(); const request = fetch('/api/profile', { signal: controller.signal, }); controller.abort(); Once aborted, the fetch promise rejects. Cancellation is therefore part of normal control flow and should be handled deliberately.

JavaScript Fetch API

JavaScript / Updated 07 Sep 2025 / 2 min read

Use Optional Chaining (`?.`) Safely in JavaScript

Optional chaining (?.) lets JavaScript stop a property-access chain when the value immediately before ?. is null or undefined. Instead of throwing, the expression evaluates to undefined. Nested Properties const user = { profile: { name: 'Alice', address: { city: 'Wonderland' }, }, }; const city = user.profile?.address?.city; const postalCode = user.profile?.address?.postalCode; postalCode is undefined rather than causing an error.

JavaScript

JavaScript / Updated 02 Sep 2025 / 1 min read

Use `Promise.any()` for the First Successful Result

Promise.any() fulfills as soon as one input promise fulfills. Rejections are ignored until either a promise succeeds or every input promise has rejected. const first = Promise.reject(new Error('first failed')); const second = new Promise((resolve) => setTimeout(resolve, 100, 'second succeeded')); const third = new Promise((resolve) => setTimeout(resolve, 200, 'third succeeded')); console.log(await Promise.any([first, second, third])); // second succeeded When Everything Fails If every promise rejects, Promise.any() rejects with an AggregateError:

JavaScript

JavaScript / Updated 02 Sep 2025 / 1 min read

Replace Every Match with JavaScript `String.replaceAll()`

String.prototype.replaceAll() replaces every occurrence of a substring or every match of a global regular expression and returns a new string. Replace a Literal Substring const text = 'Hello World! Welcome to the World of JavaScript.'; const result = text.replaceAll('World', 'Universe'); Use a Regular Expression When searchValue is a RegExp, it must use the g flag:

JavaScript

JavaScript / Updated 02 Sep 2025 / 2 min read

Private Fields and Methods in JavaScript Classes

JavaScript classes support truly private fields and methods using names that begin with #. They can be accessed only from code inside the class body that declares them. Private Fields class Person { #name; constructor(name) { this.#name = name; } getName() { return this.#name; } } Trying to access person.#name outside the class is a syntax error.

JavaScript

JavaScript / Updated 02 Sep 2025 / 1 min read

JavaScript RegExp `d` Flag: Get Match Indices

The JavaScript regular-expression d flag enables match indices. It does not collect repeated captures; instead, it adds an indices property that tells you the start and end offsets of the overall match and each capturing group. Basic Example const regex = /(?<year>\d{4})-(?<month>\d{2})-(?<day>\d{2})/d; const match = regex.exec('Date: 2024-08-30'); console.log(match[0]); // 2024-08-30 console.log(match.indices[0]); // [6, 16] console.log(match.indices.groups.year); // [6, 10] console.log(match.indices.groups.month); // [11, 13] console.log(match.indices.groups.day); // [14, 16] The end index is exclusive, matching the behavior of String.prototype.slice().

JavaScript

JavaScript / Updated 07 Sep 2025 / 1 min read

JavaScript Numeric Separators (`_`)

JavaScript numeric separators let you place underscores inside numeric literals to improve readability. They do not change the numeric value. const million = 1_000_000; console.log(million); // 1000000 Decimal Fractions const pi = 3.141_592_653; Binary, Octal, and Hexadecimal const binary = 0b1010_1011; const octal = 0o123_456; const hex = 0xFF_FF_FF; Separators can also be used in BigInt literals:

JavaScript

JavaScript / Updated 07 Sep 2025 / 1 min read

JavaScript Nullish Coalescing Operator (`??`)

The nullish coalescing operator, ??, provides a fallback only when the left-hand value is null or undefined. const username = null; const name = username ?? 'Guest'; console.log(name); // Guest ?? vs. || || falls back for every falsy value. ?? preserves valid falsy data such as 0, false, and '':

JavaScript

JavaScript / Updated 07 Sep 2025 / 2 min read

JavaScript BigInt: Handling Large Integers

JavaScript Number can represent integers exactly only up to Number.MAX_SAFE_INTEGER (2^53 - 1). When you need larger integer values without losing precision, use BigInt. Create a BigInt const a = 123456789012345678901234567890n; const b = BigInt('123456789012345678901234567890'); The n suffix creates a BigInt literal. BigInt() is useful when converting a string or an integer-valued Number.

JavaScript

JavaScript / Updated 02 Sep 2025 / 1 min read

JavaScript `||=`: Logical OR Assignment

The logical OR assignment operator, ||=, assigns a new value only when the current left-hand value is falsy. let name = ''; name ||= 'Guest'; console.log(name); // 'Guest' Falsy values include false, 0, -0, 0n, '', null, undefined, and NaN.

JavaScript

JavaScript / Updated 02 Sep 2025 / 1 min read

JavaScript `&&=`: Logical AND Assignment

The logical AND assignment operator, &&=, assigns a new value to its left-hand operand only when the current value is truthy. Basic Syntax variable &&= newValue; Conceptually, this is similar to:

JavaScript

JavaScript / Updated 07 Sep 2025 / 1 min read

JavaScript `??=`: Nullish Coalescing Assignment

The nullish coalescing assignment operator, ??=, assigns a value only when the current left-hand value is null or undefined. let name = null; name ??= 'Guest'; console.log(name); // Guest Function Defaults function greet(user) { user ??= 'Stranger'; console.log(`Hello, ${user}!`); } A default parameter may be even clearer when only undefined needs a fallback:

JavaScript