stnd.buildSTANDARD MANUAL2026-07-15

@stnd/dom

@stnd/dom

Lightweight DOM manipulation and extraction utilities.

ELI5

Once content is rendered to an HTML string (by @stnd/press, usually), these are the scissors: pull out all the images to lazy-load them, grab the headings to build a table of contents, split the content in two at the first occurrence of a given tag (partition). It works the same whether that HTML lives in a Cloudflare Worker or a browser tab — no Node-only APIs.

Use it:

import { extractHeadings } from "@stnd/dom";
const headings = extractHeadings(html, [1, 2]); // table of contents data

Overview

@stnd/dom provides a set of utilities for processing HTML strings and DOM elements. These are designed to be used both on the server (using linkedom) and in the browser.

Key Exports

  • transformImages(html, callback): Transform all <img /> src attributes.
  • enhanceImages(html, callback): Add srcset and sizes to images.
  • extractImages(html): Get a list of all images and their attributes.
  • extractHeadings(html, levels): Extract heading data for TOCs.
  • extractElements(html, tag): Extract all elements matching a tag name.
  • removeElements(html, pattern): Remove elements based on tag names or selectors.
  • partition(html, tag): Split HTML content at the first occurrence of a tag.

Usage

import { extractHeadings } from "@stnd/dom";

const html = "<h1>Title</h1><p>Text</p><h2>Subtitle</h2>";
const headings = extractHeadings(html, [1, 2]);

// headings = [{ level: 1, text: "Title", id: "title" }, { level: 2, text: "Subtitle", id: "subtitle" }]

Features

  • Edge-Ready: No dependencies on heavy Node.js built-ins.
  • Fast: Minimal overhead for processing large HTML blocks.
  • Isomorphic: Works identically in Node.js, Workers, and Browser.

Notes / Observations

(jot down anything noticed here — quirks, gotchas, ideas)

Todo

  • [ ] Nothing tracked yet.