iUI, jQTouch, WPTouch, PhoneGap, XUI, iWebkit, Rhodes, gwt-mobile... Cuando empezamos a maravillarnos de que las aplicaciones web móviles estén llenas de varios frameworks y bibliotecas de clases, de hecho, los principales frameworks web apenas han comenzado su Campos móviles: versión táctil de YUI3.2 de Yahoo, jQueryMobile de jQuery, ExtJS que integra JQTouch y el marco Sencha Touch lanzado por la biblioteca Raphaël. . .
El cambio de nombre de ExtJs a Sencha realmente me sorprendió. Después de todo, una vez fui fanático del marco ExtJs. De hecho, no es fácil que un marco tan pesado cambie repentinamente y se desarrolle en la dirección del tacto móvil. No podemos dejar de maravillarnos ante el impacto de los importantes cambios que se avecinan.
Bien, aquí no quiero presentarles la comparación de uso y rendimiento de varios marcos de aplicaciones web móviles. Simplemente influenciado por ExtJs y queriendo saber hasta dónde había llegado y acumular mejor experiencia en front-end, comencé a imaginar cuál debería ser un buen marco de trabajo para aplicaciones móviles web y comencé a intentar implementarlo. Reinventar la rueda es simplemente obligarse a comprender este campo más profundamente, no ser lo suficientemente arrogante como para desafiar nada. Entonces, después del análisis y la comparación, el resumen es el siguiente:
1.ligero
Este debería ser el punto más importante en el marco de las aplicaciones móviles. No piense en la popularidad de 3G y WiFi. Las condiciones nacionales son difíciles para la mayoría de los usuarios para descargar sus archivos CSS y JS de 100K en 3 segundos. Por lo tanto, el marco de nuestra aplicación móvil debe ser lo más liviano posible y todos los métodos de implementación de funciones y nombres deben ser lo más concisos y comprimidos posible. Deseche esos componentes y efectos especiales de aplicaciones web para PC, no agregue 7,80K de jQuery.js a su página solo para un efecto de menú.
2. Compatibilidad con los principales navegadores móviles
Con tantas plataformas móviles y navegadores, es difícil que su aplicación móvil se comporte de manera consistente en todos los navegadores. A veces es necesario cargar diferentes archivos de estilo para diferentes navegadores o ejecutar diferentes funciones para lograr el efecto. Por lo tanto, nuestro marco debe tener un método que pueda identificar varios navegadores convencionales. Para ser específico, su marco debe poder distinguir entre iPhone, iPad, Android, Windows Phone, etc. Bueno, para ser más específico para el país, QQ mobile. navegador y UCWeb. Lo último a tener en cuenta es que intentamos no utilizar el método AU para juzgar aquí, porque el avigator.userAgent de cada navegador es muy poco confiable. Aquí puede consultar la idea de mooltools para juzgar el navegador y aplicarlo. a nuestro campo móvil.
3. Potente selector
Se puede decir que el selector es el alma del marco. Las pseudoclases avanzadas de CSS3 se utilizarán ampliamente en futuras aplicaciones web móviles. Por lo tanto, nuestro marco debe poder atravesar y localizar tantas etiquetas HTML5 y pseudoclases de CSS3 como sea posible. como sea posible, incluso si son como E:first-of-type es una estructura que no es compatible con los selectores jquery.
4. Efecto de animación de página
A diferencia de las aplicaciones web de escritorio, las aplicaciones móviles son mucho más deslumbrantes en términos de efectos de cambio de página, como: cambio deslizante, ventana emergente de máscara, aparición y desaparición gradual, pantalla de presentación, efectos de acercamiento y alejamiento en iPhone, etc. Eche un vistazo a las definiciones CSS de animaciones de desvanecimiento y zoom.