2012-08-18 14 views
8

He creado una aplicación que contiene varios botones a la página de inicio haciendo clic en uno de botón que mi aplicación redirige a algún punto de vista que contiene JQM forma, con el calendario JQM, campo de texto, botones y base de datos, etc .. ..Jquery Mobile Application comportamiento extraño

Mi consulta es que cuando pruebo mi aplicación en un dispositivo Android en ese momento la aplicación funciona un poco lenta, incluso si no he usado ninguna imagen, o cualquier información que pueda contener más espacio. Esa es mi primera consulta y la segunda es que cuando probé mi aplicación en la tableta Android en ese momento esa página de formulario aparece por un tiempo y de repente redirige a la página de inicio automáticamente, mientras que esta misma característica funciona bien para el teléfono Android.

¿Por qué este extraño problema?

Si alguno me puede guiar en él que será un placer

+0

¿Qué versión de jQuery Mobile? ¿Qué versión de PhoneGap? ¿Qué has hecho hasta ahora para intentar una solución? ¿Puedes mostrar algún código, por ejemplo, el orden de JS incluye? – Jasper

Respuesta

5

Es difícil hacer suposiciones con respecto a la lenta el rendimiento y la cuestión de redirección. A continuación puede encontrar algunos aspectos que en mi opinión afectar al rendimiento de una aplicación móvil que consiste en HTML5, CSS3, JavaScript y debe ser tomado en cuenta en el análisis, el diseño y la fase de desarrollo.

método de implementación basado en el tamaño se recomienda

En el desarrollo de pequeñas aplicaciones móviles el uso de una sola página HTML usando vinculación página interna en AJAX. Para aplicaciones móviles más grandes, se recomienda un método para usar diferentes páginas HTML con enlaces internos de AJAX. Intenta crear plantillas de página reutilizables.

transiciones de página

Como se indica en la jQM 1.1.1 Docs, por defecto, todas las transiciones de fundido, excepto requieren transformación 3D apoyo. Los dispositivos que carecen de soporte 3D volverán a una transición de fundido, independientemente de la transición especificada. jQM hace esto para excluir proactivamente las plataformas con bajo rendimiento como Android 2.x de las transiciones avanzadas y garantizar que aún tengan una experiencia fluida. Tenga en cuenta que existen plataformas como Android 3.0 que técnicamente admiten transformaciones 3D, pero que aún tienen un rendimiento de animación deficiente, por lo que esto no garantizará que cada navegador tenga 100% de parpadeo. Decida el tipo de transición que usará después de considerar lo anterior.

Minify JS y CSS

Cada página debe ser lo más ligero posible. El objetivo de la minificación es preservar las cualidades operativas del código al tiempo que reduce su huella de bytes global. Hay muchas herramientas disponibles en la WEB como YUI Compressor, Minify y muchas más. Además, hay herramientas como la JLint que se utiliza para verificar si el código fuente de JavaScript cumple con las reglas de codificación. JLint es una herramienta de calidad de código que busca problemas en el código JavaScript. Los problemas informados no son necesariamente errores de sintaxis, pero pueden ser problemas estructurales. Tenga en cuenta que JLint no prueba que su código sea correcto. Considéralo una herramienta de ayuda. También hay herramientas para realizar la optimización de CSS. La optimización le ayuda a obtener tamaños de archivo CSS más pequeños y un mejor código escrito. Puede encontrar muchos optimizadores de CSS disponibles en la WEB, como CleanCSS y CSSTidy.

Componentes limita

se recomiendan las páginas HTML que limitarse a 25kb con el fin de obtener la ventaja de almacenamiento en caché óptimo para la mayoría de los navegadores web para móviles. El límite de almacenamiento en caché varía según la versión del sistema operativo. Por ejemplo, Android 2.1 tiene un límite de caché de aproximadamente 2Mb.

& HTML5 CSS3

intenta crear fácil de leer, para extender y código reutilizable. Es importante aprovechar al máximo el uso de HTML5 y CSS3. La declaración de HTML5 DocType (<!DOCTYPE html>) debe ser lo primero en su documento HTML5 antes de la etiqueta html. Es una instrucción para el navegador web acerca de qué versión de HTML de la página está escrita en.

Utilice la W3C mobileOK Checker

El W3C mobileOK Checker es un servicio gratuito por el W3C que ayuda a comprobar el nivel de amabilidad móvil de la Web documentos, y en particular afirman si un documento web es mobileOK. Una página web es mobileOK cuando pasa todas las pruebas. Las pruebas se definen en el mobileOK Basic Tests 1.0 specification. Para comprender por qué es realmente importante consultar un documento web para la movilidad de los dispositivos móviles, probablemente valga la pena destacar algunos puntos sobre el llamado mundo móvil. En comparación con una computadora de escritorio común, un dispositivo móvil puede considerarse limitado a primera vista: tamaño de pantalla más pequeño, capacidades de procesamiento más pequeñas, menor cantidad de memoria, ningún mouse, etc. En comparación con las conexiones de datos fijos, las redes móviles pueden ser lentas y, a menudo, tienen una latencia más alta. En comparación con un usuario que se sienta frente a su computadora, el usuario mientras viaja tiene un tiempo limitado y se distrae fácilmente. Además de estas limitaciones, el mundo de los dispositivos móviles está muy fragmentado: muchos dispositivos diferentes, cada uno de los cuales define un conjunto único de funciones admitidas.

en cuenta la aparición en pantalla de diferentes tamaños

La densidad de pantallas de visualización y el tamaño y la escala de la página web debe tenerse en cuenta a la hora dirigidos a diferentes tamaños de pantalla. Los metadatos de la ventana gráfica se pueden usar para definir el tamaño de la ventana gráfica donde la ventana gráfica es el área del contenedor en el que se dibuja la página. La escala de vista define el nivel de zoom que se aplica a la página web. La propiedad de viewport target-densitydpi y las técnicas de CSS, JS se pueden usar para cambiar la densidad de la pantalla de destino para la página web. Hay muchos artículos en la WEB con respecto a la apariencia en diferentes tamaños de pantalla.

Identificar los flujos con retraso potencial

El PageSpeed Firefox/Chrome extension se puede utilizar para comprobar las páginas velocidad. Cuando se perfila una página web con Page Speed, se evalúa la conformidad de la página con una serie de reglas diferentes. Estas reglas son mejores prácticas de front-end generales que puede aplicar en cualquier etapa del desarrollo web. La extensión brinda consejos y sugerencias específicas sobre cómo implementar mejor las reglas e incorporarlas al proceso de desarrollo.

Espero que esto ayude.

+0

Gracias. Su respuesta es realmente útil para mí, es muy agradable tener esto en cuenta mientras desarrollamos aplicaciones multiplataforma.Se lo recomendaré a otros desarrolladores de Phonegap para que también puedan sacar provecho de él. Gracias de nuevo por la buena respuesta. – Aamirkhan

+0

Me alegro de poder ayudar :) La respuesta anterior es la opinión personal y la experiencia que mi experiencia ha demostrado. Tal vez alguien más considere diferentes aspectos de rendimiento. Gracias –

+0

hmmm pero lo más probable es que tu respuesta sea correcta – Aamirkhan