Daily Reading for 2026-10-18

Inline Rendering with document.currentScript

Lean Rada’s inline-rendering trick, surfaced by Simon Willison, turns a single well-known DOM property into a surprisingly capable mini template language. Because document.currentScript points at the executing <script> element, an inline script can call replaceWith() to swap itself for a computed value — a live year, a timestamp, anything — with no framework, build step, or server render. Wrapping that in a one-character $() helper yields readable inline expressions inside otherwise static HTML. The appeal for a technical reader is leverage: a stable, commoditised browser API quietly enables custom, low-cost dynamic content exactly where heavyweight tooling used to be the default.

Watch for:

• Whether the document.currentScript + replaceWith() idiom spreads beyond link blogs into static-site and documentation generators.
• Edge cases: scripts injected via innerHTML, modules, and async/deferred execution where currentScript is null.
• Whether frameworks adopt the pattern or keep pushing templating into build-time and runtime layers.
• How this interacts with CSP and inline-script restrictions in stricter deployments.

Wardley signals:

• Components: document.currentScript (DOM API), inline <script> elements, the $() shorthand helper, static HTML pages, browser DOM, and server-side/build-time templating alternatives.

• Evolution stage: document.currentScript is Commodity — a standardised, ubiquitous browser platform API; the inline self-replacing technique is Genesis — novel, custom, poorly understood, with no accepted form; the $() template shorthand is Genesis/Custom — a personal idiom.

• Doctrine hits/misses: hits “Think fast, inexpensive, restrained and elegant” (Development, Phase II) and “Use appropriate tools”; also “A bias towards open” (Communication, Phase II) via publishing the trick; misses none clearly.

• Climatic patterns: “Efficiency enables innovation (Componentisation effect)” — a stable, commoditised DOM API enables a new technique; and “Increased stability of lower order systems increases agility & speed of re-combination”.

• Diffusion markers: spread through a personal link blog and credited source (Lean Rada), plus reuse of a tiny idiom across static pages — early signs of a technique diffusing through practitioner networks rather than standards bodies.

• Inline rendering with document​.currentScript

wardley-beta
%% 1. Users: web authors who want dynamic values inside otherwise static HTML
%% 2. Needs: render computed content inline without a build step or framework
%% 3. Capabilities: reach the executing script element, replace it in place, expose a tiny helper, serve static pages safely
%% 4. Components: domCurrentScript, scriptReplaceWith, inlineTemplateHelper, browserDom, staticHtmlPages, cspPolicy
%% 5. Maturity: document.currentScript and replaceWith are Commodity browser APIs; the self-replacing inline technique and $() helper are Genesis/Custom; static HTML is Commodity; CSP is Product
%% 6. Management: browser vendors standardise the DOM APIs; individual developers adopt the trick in their own pages
anchor webAuthor [0.9, 0.92]
component domCurrentScript [0.82, 0.4]
component scriptReplaceWith [0.75, 0.45]
component inlineTemplateHelper [0.15, 0.55]
component browserDom [0.9, 0.2]
component staticHtmlPages [0.88, 0.5]
component cspPolicy [0.62, 0.25]
inlineTemplateHelper -> scriptReplaceWith
scriptReplaceWith -> domCurrentScript
domCurrentScript -> browserDom
browserDom -> staticHtmlPages
cspPolicy -> browserDom
staticHtmlPages -> webAuthor
inlineTemplateHelper -> staticHtmlPages
evolve inlineTemplateHelper 0.32

web-edit File Editor

web-edit is Simon Willison’s deliberately tiny browser for editing files in a folder, built mainly so he can reach machines over Tailscale. Version 0.1a2 adds copy-to-clipboard for both text and image data, a small feature with an outsized payoff: it lets him run prompts on a laptop from his phone and paste the resulting logs straight into a Gist. The throughline is personal, composable tooling — stitching commodity building blocks (a mesh VPN, the browser clipboard, Gist) into a workflow tuned to one person’s actual needs rather than a general product. It is a reminder that the friction removed by such glue code is often where real productivity gains hide.

Watch for:

• Whether copy-to-clipboard for image data becomes a standard expectation in browser-based editors and notebooks.
• Continued phone-as-client workflows for driving long-running LLM jobs on laptops and servers.
• How Tailscale-style mesh networking keeps reshaping “edit files on any of my machines” tools.
• Whether tiny personal tools like web-edit get folded into larger products or stay deliberately unpolished.

Wardley signals:

• Components: web-edit (a self-built file editor), Tailscale (mesh VPN), the browser Clipboard API, GitHub Gist, mobile browser, and the DeepSeek 4.1 Flash LLM prompt workflow.

• Evolution stage: Tailscale is Product trending to Commodity — a managed, increasingly utility-like connectivity layer; the Clipboard API and Gist are Commodity — standardised, essential, invisible; web-edit itself is Custom/Genesis — a bespoke personal tool; the LLM workflow is Product — rapidly improving, feature-differentiated.

• Doctrine hits/misses: hits “Focus on user needs” and “Know your users” (Development, Phase I) by building for one real workflow; hits “Think fast, inexpensive, restrained and elegant” and “Do better with less” (Operation); also “Bias towards action” (Learning, Phase II).

• Climatic patterns: “Efficiency enables innovation (Componentisation effect)” — commoditised VPN and browser APIs make a personal tool cheap to build; and “Higher order systems create new sources of value” — composing utilities into a new workflow.

• Diffusion markers: personal blog release notes, copy-cat tooling for mobile-plus-laptop LLM workflows, and the spread of “paste logs into a Gist” as a common practice.

• web-edit 0.1a2

wardley-beta
%% 1. Users: a developer editing files across several machines from phone or laptop
%% 2. Needs: reach any machine, edit a folder, copy text/image, and paste logs into a shareable Gist
%% 3. Capabilities: secure remote connectivity, a browser-based editor, clipboard access, snippet sharing, LLM prompting
%% 4. Components: webEdit, tailscale, clipboardApi, githubGist, llmModel, mobileBrowser
%% 5. Maturity: web-edit is Custom (a personal tool); Tailscale is Product trending to Commodity; clipboard, Gist and mobile browsers are Commodity; the LLM model is Product
%% 6. Management: the developer maintains web-edit; Tailscale, GitHub and model vendors manage the platform pieces
anchor remoteDeveloper [0.9, 0.93]
component webEdit [0.35, 0.7]
component tailscale [0.78, 0.5]
component clipboardApi [0.9, 0.45]
component githubGist [0.92, 0.35]
component llmModel [0.55, 0.6]
component mobileBrowser [0.88, 0.55]
webEdit -> remoteDeveloper
tailscale -> webEdit
clipboardApi -> webEdit
mobileBrowser -> webEdit
llmModel -> webEdit
githubGist -> clipboardApi
evolve webEdit 0.5