IOS HTML Canvas o CSS3 Transformaciones 3D

En la plataforma IOS:

El elemento canvas de HTML5 no está acelerado por hardware. Transformaciones 3D CSS3 (ejemplo: translate3d) son acelerados por hardware.

Buscando crear un juego 2d para iOS usando HTML/JavaScript con PhoneGap, ¿debería considerar usar solo el DOM con CSS3?

¿Alguien ha probado esto? ¿Hay puntos de referencia?

preguntado el 29 de junio de 12 a las 20:06

3 Respuestas

También tuve esta preocupación cuando construí mi propio juego 2D. Inicialmente tuve problemas con el rendimiento de la animación en iOS, pero lo resolví con las transformaciones 3D de CSS3. No probé Canvas, pero realmente no necesitaba hacerlo una vez que se aplicó el CSS adecuado. Y el rendimiento siguió siendo bueno con PhoneGap en las versiones de iOS y Android. Algunos dispositivos Android más antiguos son algo lentos, pero tampoco creo que Canvas ayude con eso.

En cuanto a la evaluación comparativa, encontré esto que muestra las transiciones de Canvas y CSS3 con imágenes: http://www.spielzeugz.de/html5/compare/

Respondido 23 ago 12, 02:08

La respuesta aceptada es en realidad extremadamente engañosa, al igual que partes de la pregunta. Para aclarar las cosas:

  • iOS 5 y versiones posteriores utilizan aceleración de hardware para Canvas.
  • El lienzo no está muy bien diseñado, en absoluto. La aceleración de hardware solo se activa si aplica transformaciones. Si borra y vuelve a dibujar, incluso con requestAnimationFrame, su rendimiento aún puede ser entrecortado. Definitivamente vas a notar diferencias.
  • Las transformaciones CSS3 pueden generar un mejor rendimiento para dispositivos Android.

Respondido 12 Feb 13, 00:02

Hice un intento pero perdí el interés. Parecía ser tan eficiente como hacer lo mismo que estaba haciendo con los lienzos. No notará mucha diferencia a menos que esté haciendo cálculos pesados ​​​​de javascript, lo que probablemente hará independientemente de si usa CSS3 o lienzo.

No conozco ningún punto de referencia, pero puedes leerlo aquí: http://www.sencha.com/blog/apple-ios-5-html5-developer-scorecard/

También va a depender de qué dispositivo estás hablando. Todos ejecutan hardware diferente y software ligeramente diferente, por lo que debería afectar su decisión: http://www.codefessions.com/2012/03/how-fast-is-html5-canvas-part-2.html

Canvas está bastante bien diseñado, de tal manera que no hará mucha diferencia si el hardware lo acelera o no, especialmente si solo está haciendo cosas en 2D.

Respondido el 29 de junio de 12 a las 20:06

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.