Skip to content

Commit 727e234

Browse files
kt3kclaude
andcommitted
feat: add og-worker for on-demand daily-post og:image cards
Cloudflare Worker (changelog-og) that renders 1200x630 og:image cards per daily post at request time, fetching the post's frontmatter from the repo and drawing via workers-og/satori. Wired into base.vto behind the og_worker_url data flag (empty = fall back to build-time per-repo cards). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
1 parent 3ffa00a commit 727e234

12 files changed

Lines changed: 2035 additions & 0 deletions

File tree

.gitignore

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,3 +3,7 @@ _cache/
33
.cache/
44
.env
55
.claude/scheduled_tasks.lock
6+
7+
# og-worker (Cloudflare Worker)
8+
og-worker/node_modules/
9+
og-worker/.wrangler/

docs/og-image.md

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,9 @@ Social-card images used in `og:image` / Twitter cards, referenced from
77
About, and any page without a `repo`.
88
- **Per-repo cards** (`/<owner>/<name>/index.png`) — generated at build time for
99
every watched repo; used by all of that repo's pages.
10+
- **Per-daily-post cards** (`og-worker/`) — rendered on demand by a Cloudflare
11+
Worker; used by daily article pages when `og_worker_url` is set in
12+
`src/_data.yml`.
1013

1114
## Per-repo cards (generated at build time)
1215

@@ -23,6 +26,36 @@ fetched from Google Fonts; OFL-licensed). Satori quirk to know: a percentage
2326
`width` against an auto-sized parent collapses to 0 — the accent underline
2427
instead relies on the default `stretch` cross-axis alignment.
2528

29+
## Per-daily-post cards (rendered at request time)
30+
31+
`og-worker/` is a Cloudflare Worker serving
32+
`GET /<owner>/<name>/<YYYY-MM-DD>.png` (the path mirrors the article URL). Per
33+
request it fetches the post's markdown from `raw.githubusercontent.com`, reads
34+
the frontmatter (title, commits, …), renders the card with satori
35+
(`workers-og`), and caches it at the edge — immutable for published posts, one
36+
hour for not-yet-published dates. No build step or data store involved, so
37+
nothing else needs to change when posts are added.
38+
39+
```sh
40+
cd og-worker
41+
npm install
42+
npm run dev # local: http://localhost:8787/denoland/deno/2026-06-04.png
43+
npm run deploy # needs `npx wrangler login` once
44+
```
45+
46+
After the first deploy, set `og_worker_url` in `src/_data.yml` to the worker's
47+
URL (e.g. `https://changelog-og.<subdomain>.workers.dev`) — daily article pages
48+
then point their `og:image` at the worker; while it's empty they fall back to
49+
the per-repo cards.
50+
51+
workers-og quirks worth knowing (its HTML parser is HTMLRewriter-based):
52+
53+
- HTML entities are never decoded — `&nbsp;` renders literally. Use real
54+
characters (NBSP, `·`) instead, and don't HTML-escape interpolated text; angle
55+
brackets are swapped for `‹›` lookalikes instead.
56+
- A childless styled `<div>` still needs an explicit `display: flex`, or parsing
57+
mangles the tree and satori rejects it.
58+
2659
## Site-wide card (`src/og.png`, regenerated by hand)
2760

2861
### Source

og-worker/fonts/mulish-500.ttf

101 KB
Binary file not shown.

og-worker/fonts/mulish-700.ttf

101 KB
Binary file not shown.

og-worker/fonts/mulish-800.ttf

101 KB
Binary file not shown.

0 commit comments

Comments
 (0)