`next/og` compatible function built on Satori
Maintainers usually reply within 1 day
Nobody has claimed this yet.
Assessment
- Difficulty
- 5/5
- Estimated time
- Over a week
- Newbie friendliness
- 35/100
- Issue type
- Feature
- Clarity
- Mostly clear
- Activity status
- Active
- Tech stack
- typescript, wasm
Research direction
Start by reading the existing next/og shim in vinext and how Void handles Wasm modules on workerd; the issue does not name files or tests. Prototype an ImageResponse compatible with next/og using Satori and resvg, then verify JSX image generation works in Void apps on Workers.
Written by the indexing model from the issue text.
Description
Summary
It would be great if Void provided an ImageResponse compatible with next/og, so OG images can be generated from JSX in Void apps (e.g. import { ImageResponse } from 'void/og').
Motivation
Most apps need dynamic OG images, and next/og is the API most people (and coding agents) already know. If existing next/og code worked by just changing the import, moving from Next.js/Vercel to Void would be much easier.
Setting this up yourself on Workers is surprisingly tricky. Satori and resvg ship Wasm that has to be loaded as precompiled modules on workerd, and recent Satori versions don't run on Workers out of the box. This feels like something Void could solve once for everyone. vinext already has a next/og shim, but that only helps vinext apps.
Why Satori and not Cloudflare Images
Cloudflare Images can transform and overlay images, and recently added basic text rendering. But it has no layout engine: no JSX/HTML/CSS input, no flexbox, no nested styled elements. So it can't reproduce what next/og does. next/og itself is built on Satori + resvg, so building on vercel/satori is the most straightforward way to get the same output.
If this direction is appropriate, I would be happy to help implement the prototype.
- Dominant language
- TypeScript
- Stars
- 402
- Forks
- 32
- Avg merge
- 12h 1m
- Merged PRs (30d)
- 80
Getting set up
This project ships no dev container, Dockerfile or contributing guide, so setting up is up to you: start from its README, and see our first-contribution guide for the general steps.
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from voidzero-dev/void
-
Difficulty 2/5 1-3 hours Newbie friendliness 78/100
voidzero-dev/void#484 ·
Maintainers usually reply within 1 day
-
Difficulty 2/5 1-3 hours Newbie friendliness 78/100
voidzero-dev/void#463 ·
Maintainers usually reply within 1 day
-
Deploy after a secret change fails for Workers over ~750 KB: source read-back capped at 1 MiBPossibly taken @Brooooooklyn claimed this today. Open
Difficulty 2/5 1-3 hours Newbie friendliness 82/100
voidzero-dev/void#459 · 1 assignee ·
Maintainers usually reply within 1 day
-
bug
Difficulty 1/5 1-3 hours Newbie friendliness 78/100
voidzero-dev/void#428 ·
Maintainers usually reply within 1 day
-
Allow `npm create void` and `void init` to run without promptsPossibly taken @ashunar0 claimed this today. Open
Difficulty 4/5 3-5 days Newbie friendliness 57/100
voidzero-dev/void#491 · 1 comment ·
Maintainers usually reply within 1 day
All issues in voidzero-dev/void
Similar issues
-
Difficulty 2/5 1-3 hours Newbie friendliness 76/100
radix-ui/primitives#4228 ·
Maintainers usually reply within 1 day
-
Difficulty 2/5 1-3 hours Newbie friendliness 66/100
-
Difficulty 2/5 1-3 hours Newbie friendliness 70/100
SignalK/freeboard-sk#1093 ·
Maintainers usually reply within 1 day
-
Difficulty 2/5 1-3 hours Newbie friendliness 76/100
Maintainers usually reply within 1 day
-
[测试] 等待仓库加载后再记录多仓库排序基线Possibly taken @myot233 claimed this today. Open
Difficulty 2/5 1-3 hours Newbie friendliness 84/100
Maintainers usually reply within 1 day