Aplicaciones JavaScript / HTML / CSS en dispositivos Android – extremadamente lento

Tienes razón de que es muy lento en dispositivos Android, me encontré con el mismo problema y buscar en Internet sólo encuentro personas que están de acuerdo con nosotros.

Hice algunas cosas para acelerar las cosas (aunque viene con una calidad inferior). También sólo he comprobado en HTC Sensation y Samsung galaxia ficha 10.1. Creo que necesitará usar diferentes configuraciones para diferentes teléfonos.

1. Establecer el tamaño de la pantalla para que mi teléfono no crea un lienzo más grande y luego escalarlo de nuevo.
2. Escala hasta la escena por el factor 2. Esto cortará los píxeles utilizados en la mitad, por lo que en realidad tiene un lienzo más pequeño estirado en la pantalla completa
3. Dont use clearRect para borrar todo el lienzo y luego volver a dibujar todo. En realidad la eliminación de la clearRect en su ejemplo bola rebote mostrará una gran cantidad de mejora. Limpiar las áreas que realmente cambian (murciélagos y pelota) y luego redibujarlo será suficiente.

En un lado no me di cuenta de que android 2 y 4 realizar más rápido que 3, pero que se basa en las pruebas con sólo 3 dispositivos, por lo que no es difícil estadísticas.

También leí que el uso de translate3d en un lienzo activará la renderización de hardware si está disponible, pero no he comprobado / confirmado esto.

Algunos códigos que pueden ayudarle:

<meta name="viewport" content="width=device-width, initial-scale=0.5, user-scalable=no"/> $(gameEl).css('-webkit-transform', 'scale3d(2, 2, 0) translate3d(0, 0, 0)'); $(gameEl).css('-webkit-transform-origin', '0 0');