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

Render loop redraws on every animation frame, even when nothing changed or the terminal is hidden

Offen
  • Stimmt etwas nicht?
#208 0 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

Bewertung

Schwierigkeit
4/5
Geschätzter Aufwand
3-5 Tage
Anfängerfreundlichkeit
48/100
Issue-Typ
Bug
Klarheit
Größtenteils klar
Aktivitätsstatus
Aktiv
Tech-Stack
typescript
Bereich
performance

Rechercherichtung

Start with Terminal.startRenderLoop() and compare its behavior with the xterm.js render service mentioned in the issue. Check how writes, resizing, scrolling, selection, hover, focus, cursor blinking, and element visibility should trigger rendering. Done means unchanged or hidden terminals do not redraw every frame, and a terminal renders again when it becomes visible.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Beschreibung

Version: ghostty-web 0.4.0 (npm latest)

What happens
Terminal.startRenderLoop() schedules requestAnimationFrame on every frame for as long as the terminal is open, and calls renderer.render() each time. It does this when nothing has changed, and also when the terminal's element is hidden (display: none) or off screen. A page that keeps a terminal mounted in the background, as the Pterodactyl panel 2.0 does so that the console survives tab switches, keeps paying for it on every other page.

Measured in Chromium with 4x CPU throttling on a page that keeps a hidden 170x57 terminal mounted while it receives about 10 lines of output per second: about 1.1 s of long animation frames per 6 s attributed to ghostty-web's frame callback, and roughly 25% fewer frames than the same page without the terminal. Unmounting the terminal removed both.

Suggestion

  • Render only when something changed: a write, a resize, scrolling, selection, hover, focus, or the cursor blink. The blink can run on its own timer at its blink rate, not at 60 Hz.
  • Pause rendering while the terminal's element is not visible, for example with an IntersectionObserver on the element, and render once when it becomes visible again. xterm.js does this in its render service.

Related: #198 (at a fractional devicePixelRatio the same loop also resizes and repaints the whole terminal on every frame).

Vorherrschende Sprache
TypeScript
Sterne
3k
Forks
193
Ø Merge
1 T. 40 Min.
Gemergte PRs (30 T.)
1

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 coder/ghostty-web

Alle Issues in coder/ghostty-web

Ähnliche Issues

Weitere Issues zu TypeScript

Neue Issues direkt in Ihr Postfach

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