2011-10-11 12 views
6

Credo di sì, ma avevo bisogno di dimostrarlo.È putImageData (...) più performante di drawImage (...)?

Immagino sia lo stesso caso di Flash e della sua Bitmap rispetto a BitmapData. Fondamentalmente, BitmapData è un estratto non visivo dei dati nella Bitmap, che consente manipolazioni molto facili e veloci.

Credo che per soluzioni ad alte prestazioni, come i giochi, Estrazione dei ImageData da ogni immagine (per esempio, ogni sprite), e il caching in un "attività" dizionario è una soluzione migliore di disegnare gli sprite se stessi nel la tela più e più volte.

Qualcuno potrebbe provarlo?

risposta

7

prendo alcun credito per mettere insieme questo test, ma è chiaro che si può vedere la performance di utilizzare drawImage() sia con una tela e un'immagine così come le prestazioni del putImageData() qui:

http://jsperf.com/canvas-drawimage-vs-putimagedata/3

Come di adesso, drawImage() è molto più veloce di putImageData(). L'ultima volta che ho sentito, questo non era previsto e gli sviluppatori del browser stavano cercando di migliorare il divario di prestazioni.

+0

Vedo. Il mio browser mostra lo stesso. Questo non ha molto senso, però. Mi aspettavo che fare manipolazioni usando ImageData fosse molto più veloce, che aprire un'immagine, estrarre i suoi dati e metterli sulla tela. Almeno, in Flash, manipolare BitmapData è il metodo preferito per eseguire operazioni sulle prestazioni – user802232

+1

Il modo in cui il classico Flash (non un nuovo oggetto Stage3D/Molehill) ottimizza le cose è tutto nella memoria principale e quindi copiato nella memoria grafica. Le tele risiedono principalmente nella memoria grafica (a seconda del browser/versione/fase lunare) e per modificare i pixel tramite javascript che l'immagine deve essere copiata nella memoria principale. Quindi per disegnare quell'imaging devi copiarlo nella memoria grafica. – Gabe

+0

La lettura della memoria grafica dalla CPU principale è ESTREMAMENTE SLOW su quasi tutte le schede video ... Guarda le specifiche per leggere la memoria RSX dalla cella sulla PS3 (4 GB/s in scrittura contro 16 MB/s leggi {{256 volte più lento!} }) http://www.ps3devwiki.com/index.php?title=RSX%23Speed.2C_Bandwidth.2C_and_Latency#speed_table (la cella è la CPU principale e la RSX è una GPU progettata da Nvidia) – Gabe

1

http://jsperf.com/ fornisce ottimi strumenti per esattamente questi tipi di confronti, verificarlo, penso che sia esattamente quello di cui hai bisogno.

0

Inoltre, putImageData non funziona quando same-origin-polizia è breaked

0

Per tele più grandi che ho trovato che non ha fatto tanto di una differenza, ma putImageData non è sicuramente come performante come drawImage per la copia di tele .

Ecco alcuni casi di test che ho usato: http://jsperf.com/canvas-size-test-case/3

ho fatto finire con l'avere alcuni problemi di prestazioni con dimensioni complessive di tela fonte, indipendentemente dalle dimensioni dei dati che sto copiando.

Problemi correlati