Hacktoberfest 2026: die Issues, die Maintainer für den Oktober markiert haben – offen und einsteigerfreundlich. Hacktoberfest-Issues durchsuchen

`next/og` compatible function built on Satori

Offen
#442 1 Kommentar 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Maintainer antworten meist innerhalb von 1 Tag

Dieses Issue hat noch niemand übernommen.

Bewertung

Schwierigkeit
5/5
Geschätzter Aufwand
Über eine Woche
Anfängerfreundlichkeit
35/100
Issue-Typ
Feature
Klarheit
Größtenteils klar
Aktivitätsstatus
Aktiv
Tech-Stack
typescript, wasm
Bereich
backend, web-dev

Rechercherichtung

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.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Beschreibung

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.

Vorherrschende Sprache
TypeScript
Sterne
402
Forks
32
Ø Merge
12 Std. 28 Min.
Gemergte PRs (30 T.)
77

Entwicklungsumgebung

Dieses Projekt bietet weder Dev-Container noch Dockerfile noch Beitragsleitfaden – die Einrichtung liegt bei Ihnen. Beginnen Sie mit der README; die allgemeinen Schritte stehen in unserem Leitfaden für den ersten Beitrag.

Erste Schritte

  1. Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
  3. Forken Sie das Repository und arbeiten Sie in einem Branch.
  4. Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.

Mehr aus voidzero-dev/void

Alle Issues in voidzero-dev/void

Ähnliche Issues

Weitere Issues zu TypeScript

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.