Mastodon

Bonus Drop #130 (2026-10-11): Hodepodge Edition

tjs; Bootstrap Is Back!; Featured Free Font: Paper Mono

Over on the main/legacy blog there are a couple posts that sort of make up for no Drop this past week.

The first introduces the revamped main/legacy blog, which used to be WordPress and is now an Astro 7 static site with a Go-based sidecar that handles ActivityPub integrations. It was a super-fun project that ate more than a few days of work. Tap the follow links there to find it on the Fediverse. I may try to do the same thing for the Drop, but using hosted WP infra for the newsletter makes it a bit more difficult.

The second is about a new addition to {hrbrthemes}. I fell pretty hard for the font mentioned in the post and that post (plus some shenanigans around scraping energy data) is an additional reason for the lack of a Drop (so there’s been content, just not in Drop form).

In other news (which further accounts for the dropped Drop), if you like to poke fun at both “AI” and the Trump regime, you may want to check out the Super Intelligencier. I needed to both mock these morons and justify my Unsplash paid sub. This Onion-esque site has been super cathartic.

And, finally, if you follow me on Mastodon, you know that I started self-hosting public Git repos using a customized version of cgit. I’ve been doing a daily look at my battles with “AI” and other bots who really hammered the site. I set up an Observable Framework site with a Git Battle Observatory that documents the battle.

Since not all that content is new to Drop readers, we’ll cover some items today, some of which caught my attention due to others that caught my ire.


tjs

Given all that is going on these days, you may not have noticed that Cloudflare bought Deno. I’d been preparing for Deno to die, since it’s been under some real strain of late, and Anthropic acquiring Bun seemed like another tap on the death knell.

I was not expecting Deno to join one of the worst companies in the history of the world, and I’m super bummed that we’ve lost two modern runtimes (seriously, don’t use the garbage vibe-coded Rust port of Bun, and back quickly away from anything Cloudflare controls). I can’t even justify using lltr (which we covered ages ago) given all that Bezos and Amazon are doing to the world writ large.

There aren’t many alternatives, though I did find one and was going to do a full-on single issue about it, but I’ll just do an intro and cover the gotchas. A TL;DR for this section is that it can replace Bun/Deno for some things but is observably slower and has far fewer capabilities (for now). You are likely better off using Node.js straight (ugh) or moving over to Go.

tjs (GH) takes its name from the Basque word txikia, meaning small or tiny. The reason for said name is that it describes the design of the project. As you might expect, it is a JavaScript runtime, built by Saúl Ibarra Corretgé (saghul), that tracks current ECMAScript and aims for WinterTC (the effort to standardize a common API surface across server-side JavaScript runtimes) compliance. It pairs QuickJS-ng (the community fork of Fabrice Bellard’s compact QuickJS engine) with libuv (the same cross-platform async I/O layer that sits under Node.js). One might describe it as a small interpreter on a mature platform layer.

If you download and just do a bit of playing with it, I’m sure it will feel familiar to Node/Bun/Deno to some degree, especially the latter two, since tjs compiles to platform executables (which requires you to do said compiling on each platform since there is no cross-architecture build toolkit baked in).

Coming from Deno, there are real structural differences, a major one being that tjs has no permission model whatsoever. The only global flags are memory, stack, and TLS-CA settings, so any script you run gets full filesystem and network access, and confinement has to come from the operating system. I’m sure one could hack this into the project to some degree, but it was one of the more compelling reasons to use Deno. Module resolution takes us back to the stone ages (when compared with Deno/Bun) with zero support for Node-style prefixes, npm, jsr, or bare package names. None of the Node globals exist — no process, Buffer, or require, file extensions are always required, and a URL works as an import but not as the entry point. Yay we get to go back to maintaining import maps!

TypeScript is not handled at runtime, which is both a curse and a blessing. Bundling strips types through a cached esbuild that needs the network on first use, and you run the TypeScript compiler yourself for checking. This makes the dev loop dance bundle-then-run, and producing a binary takes an additional step, as compilation embeds precisely one pre-bundled file with no assets.

There are also some API traps to keep in mind, starting with the fact that filesystem has no sync variants (a real “ugh” for CLI work), and the names drift from Deno and Node — makeDir and makeTempDir work differently, with the latter needing an explicit template or it fails. If you use SQLite with Deno or Bun you will also feel like your hands are tied (go poke and you’ll see why). localStorage is a single per-user database under ~/.tjs, shared by every script you run (ugh, again). The eval command prints nothing unless you print it. You’ll also get bit if you rely on normal behavior of import.meta.main and import.meta.dirname in compiled scripts. There is also no watch mode, formatter, linter, task runner, or lockfile.

CPU-bound work is about 5x slower than V8 because QuickJS-ng interprets while V8 JIT-compiles. I put together a daft simple fibonacci benchmark on my aging M1 MacBook Pro Max which took 59 ms against Deno’s 12 ms. A test of cold start performance showed no tjs advantage either, at roughly 26 ms against 28 ms.

Still, this project has a solid foundation to build on if you’d like to help provide a safe haven for those abandoned by the Deno and Bun teams.


Bootstrap Is Back!

In truth, there is no good reason for the exclamation point in the section title, as I’ve never been a fan of Bootstrap, since it has been a big reason (until “AI”-trained “design” systems took over) why every site looks like every other site on the internet (over 1.75 billion installs since 2011).

It’s been a minute since we’ve had a Bootstrap update, but version 6 is almost here and has a decent set of modern conveniences and upgrades. It’s also designed with both agents and humans in mind, so if that will cause you angst, you should head to the last section. Also, the last bit of this section is assuming some fairly deep knowledge of the legacy Bootstrap system.

The project has been rebuilt from the ground up to work with modern browsers and modern tooling. It uses the new Sass module system, ships JavaScript as ESM-only, and leans heavily on native browser features like oklch() colors, container queries, light-dark() for color modes, and native <details> and <dialog> elements that remove the need for JavaScript in components like accordions and modals. The minimum browser level has been raised to Chrome and Edge 130, Firefox 132, and Safari 18 since the framework now uses CSS features that didn’t exist a few years ago, with no fallbacks or polyfills below that line.

They’ve also changed how customization works. Back in v5, you customized Bootstrap mostly through Sass variables before compilation. In v6, nearly every visual setting is now a CSS variable organized into token maps (i.e., Sass maps that hold all the CSS variables for global settings and individual components). You can override these at build time using @use ... with and token maps, or at runtime directly in the browser by changing CSS variables, with downstream components updating in real time.

The old Sass $prefix variable is gone; custom properties are written unprefixed in the source and the bs- namespace is added by PostCSS at build time. Responsive classes have also shifted from an infix pattern to a prefix pattern borrowed from Tailwind: .d-md-none becomes .md:d-none, .col-lg-6 becomes .lg:col-6, and state modifiers like :hover work the same way across all utilities and components.

On the JavaScript side, v6 is ESM-only, so there is no UMD bundle, and no window.bootstrap global. If you only use data attributes like data-bs-toggle, you only need add type="module" to your script tag. If you import APIs directly, you will need to switch to explicit imports like import { Tooltip } from './bootstrap.bundle.min.js'. The source is also now TypeScript with its own type declarations, so @types/bootstrap can be dropped. The build tooling has been simplified too: Rolldown replaces both Rollup and Babel, Vitest running in real Chromium replaces Karma, and Astro 7 (yay!) powers the docs.

As warned, Bootstrap 6 also ships LLM-friendly documentation via llms.txt and llms-full.txt, plus a skills/ directory with agent playbooks for common tasks like migrating from v6 or using Bootstrap with different build tools.

I would counsel folks to not migrate older Bootstrap projects and limit consideration of this one to greenfield ones. I have not seen anything compelling enough to warrant jumping from other design systems to this one, but it’s nice to see a solid update for something humans can create with when every other new web thing appears to be built by Claude.


Featured Free Font: Paper Mono

It’s also been a minuter since I dropped a new font on y’all, so we’ll cover a relatively new entrant into the monospace world: Paper Mono (GH) (and nerd out on typography while we do so).

The font comes from the team behind the Paper design tool, who built it after failing to find a monospace they liked for headlines, interface text, and code alike. The distribution contains eight static weights as OTF, TTF, and WOFF2, plus a single variable TTF and WOFF2 (PaperMono[wght]). The repo’s LICENSE.txt says Paper Mono is “based on Geist Mono,” a Vercel font that we’ve coverd before.

The em is 1000 units (see the Archivo post about what that means) and every standard glyph is 606 units wide, so each cell is 0.606em (which is pretty wide if you want to use this in a coding or terminal context). The all important x-height is 509 against a 710 cap height (about 72%), so lowercase holds up at small sizes. The typographic ascender and descender units adds up to exactly 1.2em, the default line height in Paper’s playground. One wght axis runs from 100 to 800 with a default of 400, and eight named instances from Thin to ExtraBold. (I told you we were going to nerd out.)

The font has 800 glyphs and 659 encoded characters, matching the specimen’s numbers. Box drawing, block elements, arrows, and a keyboard-symbol set (⌘ ⌥ ⇧ ⌃ ⏎ ⌫ ⎋ ⇥ ⇪ and others, provided they show up in WordPress) are all included.

The six features Paper advertises are all opt-in:

TagWhat it does
ss01Coding ligatures
ss02Duospace alternates
ss03Narrow space
ss04Small arrows
cv01Single-story a
zeroSlashed zero

The type specimen shows ~15 ligatures, but the font contains 53, each with its own lookup inside ss01. I’d show some here but there’s no way they’ll carry over to WordPress. You can inspect them pretty easily in the playground.

There are at least two “easter eggs” in the glyphs. U+F8FF, the private-use code point Apple uses for its logo, holds Paper’s own logo mark in this font. Any text carrying Apple’s logo character will show Paper’s mark when set in Paper Mono (I suspect that means Apple will forbid use of it at all by their slav^Wemployees). The only default contextual alternate (calt) also relates to the brand: when that mark is followed by “Paper”, with or without a space, the “a” switches to the single-story form. It’s almost worth trying the font to see those in action.

As usual, the section header is a screencap of the markdown version of this post in both Paper Mono and the design teams Figma/Canva-esque web app/product they’re shilling with the free font (Zed was being odd on the M4 Mini, so it’s not a Zed screenshot).


FIN

Remember, you can follow and interact with the full text of The Daily Drop’s free posts on:

  • Mastodon via @dailydrop.hrbrmstr.dev@dailydrop.hrbrmstr.dev
  • Bluesky via <https://bsky.app/profile/dailydrop.hrbrmstr.dev.web.brid.gy>

☮️

Leave a Reply

Discover more from hrbrmstr's Daily Drop

Subscribe now to keep reading and get access to the full archive.

Continue reading