Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

bug: FPSCounter does not display real FPS count

Aperta
  • Qualcosa non va?
#2,759 1 commento 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 2 giorni

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
4/5
Tempo stimato
3-5 giorni
Idoneità per principianti
48/100
Tipo di issue
Bug
Chiarezza
Abbastanza chiara
Stato di attività
Tranquilla
Stack tecnologico
typescript
Ambito
performance

Direzione di ricerca

Inizia individuando l’implementazione di FPSCounter e riproducendo l’esempio collegato con il suo calcolo intensivo e le pipeline di rendering dipendenti. Traccia il modo in cui il ciclo requestAnimationFrame del contatore misura i fotogrammi, quindi verifica che il valore riportato rifletta il lavoro completato dalla GPU e non solo la temporizzazione dell’aggiornamento del display.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

bug

Currently, FPSCounter runs its own requestAnimationFrame loop. As a result, it effectively displays the screen's refresh rate.

I created a simple example that demonstrates the issue:

https://github.com/user-attachments/assets/adda6f64-7d72-4ba2-a543-11654abed80e

In this example:

  • I dispatch a heavy compute pipeline
  • I then dispatch a render pipeline that depends on the compute pipeline's resources, making dropped frames visible
  • The example's RAF loop explicitly waits for the device to finish its work

We can observe that:

  • The example's RAF timing closely matches the GPU frame time
  • Our FPSCounter starts dropping because the GPU is under heavy load and the browser no longer can deliver frames at the full speed

I looked at how Three.js implements their fps counter. Their approach is not practical for us because they inject the inspector directly into the renderer (which we don't have).

Lingua principale
TypeScript
Stelle
3.3k
Fork
135
Merge medio
4g 1h
PR unite (30g)
65

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di software-mansion/TypeGPU

Tutte le issue di software-mansion/TypeGPU

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.