android html5-canvas android-webview kineticjs android-browser

Poor Pan, Escala de rendimiento en Android Webview utilizando HTML5 Canvas y KineticJS



html5-canvas android-webview (1)

Definitivamente tendrá que almacenar en caché el escenario como una imagen inmediatamente antes de arrastrar y soltar porque si intenta renderizar cientos de elementos de texto en lienzo muy rápidamente (canvas nativo o KineticJS) el rendimiento será lento, especialmente en Android. Al finalizar, puede destruir la imagen en caché con destroy ().

Nuestra aplicación web móvil incluye un diseñador interactivo que hemos realizado utilizando HTML5 canvas y Kinetic.js . Estamos tratando de renderizar dinámicamente alrededor de 353 objetos en el lienzo, de los cuales 178 son texto y el resto son líneas y rectángulos.

Durante una operación de panorámica o escala, el lienzo deja de responder. Parece que este comportamiento solo se muestra en un dispositivo Android ya que el mismo funciona excepcionalmente bien en IOS. También probamos la misma aplicación a través de navegadores directamente y notamos un comportamiento similar que no responde en el navegador android y Chrome. Firefox es comparativamente receptivo.

Intentamos las opciones proporcionadas en los siguientes enlaces, pero el problema persiste (es decir, varias capas de lienzo) 1) Rendimiento lento con kineticjs 2) Problemas de rendimiento con HTML5 Canvas en algunos navegadores móviles.

El enfoque especificado en los enlaces KineticJS - Mover 4000 mosaicos con Stage.draggable , ¿Cómo almacenar en caché toda una capa justo antes de dragstart y revertirla en dragend? parece prometedor, pero es posible que no podamos seguir con esto ya que nuestro diseñador contendrá bastantes interacciones del usuario (como las secciones de dibujo de arrastrar y soltar).

También encontré otra pregunta aquí citando un problema similar https://stackoverflow.com/questions/18853952/kinectic-js-performance-on-android-4-1-devices-especially-pan-and-zoom-is-unre

¿Hay alguna otra solución / solución posible para mejorar este rendimiento? Por favor, ayúdenme.

EDITAR : Probamos nuestra aplicación en los siguientes dispositivos 1) Samsung Note 800 (Android 4.1.2) 2) Samsung Tab 2 (Android 4.1.2) 3) ASUS Transformer Pad TF300TG (Android 4.2.1) y 4) Nexus 7 ( Android 4.3).