2012-12-22 6 views
14

(La domanda non è specifica di three.js, ma la userò come esempio)Utilizzo di javascript per rilevare le prestazioni della CPU/GPU del dispositivo?

Ho usato three.js per sviluppare un'interfaccia web app ultimamente e ho scritto un bel fallback tra WebGL e Canvas renderer (per i browser desktop).

Ma ora il problema diventa come rilevare correttamente capacità del dispositivo, ci sono 2 aspetti del problema:

  1. del browser caratteristiche (caratteristiche statiche come WebGL/tela): questo è in gran parte risolto all'interno della comunità web utilizzando la funzione di rilevamento semplice.
  2. capacità del dispositivo: questa è la parte più difficile, senza l'accesso diretto alle informazioni hardware del dispositivo, abbiamo bisogno di alcuni modi di raccontare se dovremmo fallback a meno codice hardware esigenti.

Un esempio notevole: mobile/Opera affermazioni mobili sostegno Firefox di WebGL ma sono buggy o limitata da hardware del dispositivo.

alcune soluzioni vengo in mente finora:

  1. Utilizzare una caratteristica comune come indicatore di performance - dispositivo touch, per esempio, ha meno potente hardware in generale. La truffa: non è a prova di futuro.
  2. Blacklist noto browser/dispositivo buggy - Lo sniffing UA sarà inevitabile e può essere difficile da mantenere.
  3. Test prestazioni - da qui la domanda, oltre a eseguire il codice e misurare il framerate, ci sono opzioni migliori?

O forse non deve essere così difficile, ci sono altri suggerimenti?

risposta

0

È possibile utilizzare http://webglstats.com/ per il supporto hardware WebGL e il rilevamento delle funzioni.

+1

Mentre le statistiche sono interessanti, non vedo come questo possa essere applicato ai singoli utenti del mio sito (per abilitare il fallback corretto, senza una lista nera di dispositivo/browser).Anche dal codice sembra che il rilevamento sia fatto in un iframe, mi riservo il mio dubbio sulla scelta del metodo. – bitinn

+0

Infatti. Questa è un'informazione molto interessante, tuttavia è solo una funzione di rilevamento, qualcosa che potresti fare per ciascuno dei tuoi utenti da solo. Non ti dirà le prestazioni, a meno che tu non voglia tracciare alcune correlazioni piuttosto azzardate tra l'implementazione delle caratteristiche e le prestazioni. – desau

12

Ho finito per utilizzare un approccio di misurazione delle prestazioni in un progetto in cui volevamo utilizzare le funzioni di tela disponibili su desktop CPU/GPU con specifiche elevate, nonché dispositivi a velocità più bassa come tavoli e telefoni.

Fondamentalmente iniziamo con una complessità minima della scena, e se il renderloop richiede meno di 33 ms aggiungiamo complessità (riduciamo anche la complessità se il renderloop inizia a richiedere troppo tempo in un secondo momento).

Suppongo che nel tuo caso potresti dover eseguire un test rapido di canvas e webgl e quindi sceglierne uno. Avendo trascorso un po 'di tempo a fare ricerche su questo argomento, non mi sono imbattuto in una complicata tecnica non ovvia che risolve questo problema.

+0

Ama la soluzione su cui sei arrivato. Grazie per la condivisione. – jlmakes

+0

+1, il rilevamento e la regolazione dinamici sono l'unico modo per andare. Soprattutto se si desidera supportare qualsiasi dispositivo che utilizza la batteria e può passare alla modalità a bassa velocità mid-fly per risparmiare la batteria. Se fai un rilevamento statico una volta, ti perderai un tale cambiamento nell'ambiente. –

0

Se si utilizza three.js, è sufficiente utilizzare detector.js per verificare se Webgl è abilitato. aiuterà anche a stare lontano dal canvasrenderer. usa il webglrenderer o il softwarerender. in quanto consentono più vertici. il softwarerender è abbastanza nuovo e ha bisogno di un po 'di lavoro ma può essere usato.