Libreria di rendering 2D JavaScript [pixie.js vs three.js]

Question

Esistono poche librerie JavaScript che consentono di eseguire il rendering di grafica 2D tramite WebGL. Ho scoperto che i più popolari sono three.js e pixi.js. Entrambi consentono di utilizzare WebGL o il rendering del canvas (per i dispositivi che non supportano WebGL).

voglio chiedervi quale di queste librerie è meglio sotto le seguenti termns:

• voglio che utilizzare solo con grafica 2D, quindi il supporto 3D è completamente opzionale.
• La performance è molto importante: molti elementi, il testo, la possibilità di ridimensionare senza problemi, di tradurli, ecc. È cruziale.
• Il renderizzatore di canvas (quando il dispositivo non supporta WebGl è importante) e mi piacerebbe vedere lo stesso risultato (o molto simile) usando entrambi i renderer.

Se c'è un'altra libreria, che dovrei considerate questo in questa situazione particullar, sentitevi liberi di dire a questo proposito :)

Answer 1

ho esattamente lo stesso caso d'uso e solo provato entrambi. Il caricamento di molti sprite statici (dalla stessa immagine) è più veloce in three.js per 5000 sprite e sopra, ma l'animazione di alcuni di questi sprite offre una migliore framerate in pixi (di nuovo, per 5000 sprite). (Questo è stato testato su Chrome e IE9 su desktop)

La più grande differenza era con il renderizzatore Canvas, dove l'autodetect di Pixi fornisce gli stessi risultati del WebGL (se più lento) per lo stesso codice, ma il renderer Canvas di tre.js doesn't support the Sprite type significato per raggiungere il codice portatile devi usare le particelle. Se non usi gli sprite tanto e soprattutto hai quad o triangoli, non sarebbe un problema.

Se la disponibilità di tutorial e simili è un problema, three.js è più consolidato, quindi c'è più materiale.

In caso contrario, per un massimo di circa 2-3k elementi resi allo stesso tempo, vorrei andare con pixi.