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

Add a browser/PWA version

Offen
  • Stimmt etwas nicht?
#894 1 Kommentar 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

Bewertung

Schwierigkeit
5/5
Geschätzter Aufwand
Über eine Woche
Anfängerfreundlichkeit
25/100
Issue-Typ
Feature
Klarheit
Muss geklärt werden
Aktivitätsstatus
Veraltet
Tech-Stack
javascript, wasm
Bereich
desktop-dev, web-dev

Rechercherichtung

Beginne mit dem Vergleich der beiden vorgeschlagenen Ansätze, Broadway und Greenfield, und lies das Material zum Greenfield SDK sowie dessen Eintrag in example-applications.json. Bestimme den Umfang und die Hosting-Anforderungen für einen browserbasierten Workbench-Playground; als erledigt gilt die Aufgabe, wenn ein abgestimmter Implementierungspfad feststeht und nicht nur ein serverseitiges Experiment vorliegt.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Beschreibung

Many other prototyping tools for UI frameworks have the option to run in the browser to make it easier to share examples or work without setting up a local development environment, even if the target primarily native platforms:

It would be great if it were possible to create a similar web-based playground for Workbench, whether for docs or examples, or just for experimental. There are two ways of achieving this with different complexities:

  • Using Broadway. This way, an instance of Workbench can run on a server somewhere, and be exposed via the HTML/Canvas GTK renderer. This works well for simple examples, but more advanced usecases (OpenGL, embedding, Webviews, Videos etc.) don't work.
  • Using Greenfield. This is a full Wayland compositor that runs in your browser, and can already run the Flatpak version of Workbench out of the box. It can either run apps with Wayland clients attaching natively on the browser site (through WebAssembly), or on the server side (with the raw Flatpak version). From my testing, this works extremely well; even the GTK inspector, video playback, webviews, and OpenGL all work. Also runs in Chrome, Firefox and Safari/GNOME Web without problems.

Here is Workbench, rendering a WebKit webview, running in the browser with the second method:

Screenshot of Workbench running in Chrome

Which was as simple as setting up a new app in Greenfield's example-applications.json:

"/workbench": {
    "name": "Workbench",
    "executable": "flatpak",
    "args": ["run", "re.sonny.Workbench"],
    "env": {}
  },

Ofc, this would require a server (not just a CDN) to actually host the app similarly to how Broadway would require a server. A better way would be to compile Workbench using the Greenfield SDK, which would mean that it could run natively in the browser using Wasm, but I'm fairly certain that this would require some porting work. The Greenfield talk from FOSDEM 2024 contains a lot of interesting info on how this works internally.

Vorherrschende Sprache
JavaScript
Sterne
846
Forks
91
Keine gemergten PRs in 30 T.

Entwicklungsumgebung

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 workbenchdev/Workbench

Alle Issues in workbenchdev/Workbench

Ähnliche Issues

Weitere Issues zu JavaScript

Neue Issues direkt in Ihr Postfach

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