Cómo llamar a miles de API locales usando JS
Publicado el 15 de abril de 2014 18:02 | Número de visitas | Fuente CSDN | 0 comentarios | Autor Zhai Fangqing
Herramienta de desarrollo de entrevistas "Near Tiangong" HBuilder Wang An DCloud HTML5
Resumen: Número veinticinco de "Jintian Gong": HBuilder es un conjunto de IDE de desarrollo web desarrollado por DCloud. Mejora enormemente HTML a través de indicaciones de sintaxis completas, métodos de entrada de código, bloques de código, etc. , JS, eficiencia de desarrollo CSS. Lo que es más interesante es que también puede usar JS para llamar a API locales.
CSDN: ¿Presenta a tu equipo y tu experiencia pasada?
Anne Wang, directora ejecutiva de DCloud: Nuestro equipo ha estado trabajando en aplicaciones móviles desde 2003, desde J2me, Symbian, Win mobile, Brew hasta Android, iOS y WP. Antes de esto, habíamos estado desarrollando middleware inalámbrico para aplicaciones móviles multiplataforma en el mercado empresarial.
Más tarde, éramos optimistas sobre las perspectivas de desarrollo de HTML5, pero no pudimos resistir la tentación del mercado de ToC, por lo que decidimos iniciar un segundo negocio. Establecimos DCloud.io y comenzamos a brindar servicios de ecosistema basados en HTML5, incluidas herramientas de desarrollo y servicios en la nube.
Somos miembro del W3C y miembro fundador de HTML5 China Industry Alliance. Somos un típico equipo ligero, no mucha gente, pero muy geek. Uno de nuestros socios, Wang Huai, también trabaja en Facebook desde hace mucho tiempo y nos trajo muchos modelos de Silicon Valley.
CSDN: ¿Por qué quieres crear una herramienta como HBuilder?
Ann Wang: Algunas personas dicen que HTML5 carece de "capacidad, trabajo y capacidades", donde "trabajo" se refiere a la falta de herramientas, y esto es cierto.
Existen excelentes entornos de desarrollo integrados para cualquier lenguaje de programación convencional, ya sea java, .net u Obj-C, pero el campo HTML5 se ha desarrollado utilizando editores de texto ineficientes. Personalmente, he estado usando editores de texto durante más de diez años y no soporto la eficiencia de los entornos de desarrollo integrados que conozco en comparación con otros lenguajes.
Cuando HTML nació hace más de diez años, era sólo un simple lenguaje de marcado y, de hecho, un editor de texto era suficiente. En aquel entonces, nadie pensaba que las personas que escribían páginas web fueran verdaderos programadores. Pero los tiempos han cambiado. Ahora JS y CSS se han convertido en lenguajes de programación reales. En este momento, un proyecto será muy ineficiente sin un IDE. Esto es como usar un editor de texto para escribir Java u Obj-C, que es mucho menos eficiente que un entorno de desarrollo integrado profesional.
Realmente no había muchos IDE HTML5 buenos en el pasado, y mucho menos buenas herramientas gratuitas. Debido a que el desarrollo de Web IDE es realmente muy difícil, la biblioteca de sintaxis web no está estandarizada y se actualiza todos los meses, y JS es un lenguaje dinámico sin tipo...
Sin embargo, habrá problemas. solucionadores. Por lo tanto, dedicamos mucho esfuerzo a construir la biblioteca de gramática y la base de datos compatible con el navegador más completa, y desarrollamos un motor de análisis JS dinámico y una biblioteca de gramática de marco de código abierto. También hemos invertido mucha energía en mejorar la eficiencia del desarrollo. La velocidad es la característica más importante de HBuilder y puede aumentar la eficiencia del desarrollo varias veces.
Por otro lado, el valor importante de HTML5 radica en el desarrollo de aplicaciones móviles. HBuilder proporciona a los desarrolladores un conjunto completo de soporte para el desarrollo de aplicaciones móviles, admite la depuración en máquinas reales mediante la inserción de un cable de datos y. no requiere entornos de desarrollo nativos como xcode. Puede empaquetar aplicaciones móviles. Además, contamos con una tecnología innovadora que permite a JS llamar a cientos o miles de API nativas.
CSDN:
HBuilder ha sido pionero en soporte completo para el desarrollo HTML5 y, lo más importante, soporte completo para desarrolladores. CSDN: ¿A qué aspecto de las aplicaciones móviles se dirige HBuilder? ¿Cuál es la situación actual en esta etapa? ¿Cuál es el patrón?
Wang An: Utilice HTML5, JS y CSS para desarrollar aplicaciones móviles multiplataforma. De hecho, dichas herramientas ya incluyen Phonegap y Titanium. Comparando en términos de categorías, Phonegap solo tiene tiempo de ejecución y no IDE. El IDE de Titanuim es una herramienta patentada creada para su API especial. Pero HBuilder es un IDE universal para el desarrollo HTML5 y tiene un tiempo de ejecución móvil incorporado, lo que significa que los desarrolladores sólo necesitan HBuilder, PC Web, Mobile Web, una aplicación, una herramienta y un conjunto de código.
Promovemos un concepto llamado "aplicaciones reactivas": conjuntos de código que llaman a diferentes funciones según diferentes entornos operativos para optimizar la experiencia del usuario. Por ejemplo, un cuadro de texto es un cuadro de entrada de texto en un navegador normal y, cuando se ejecuta en el navegador Chrome, se agrega un predicado para invocar la entrada de voz de Chrome, y cuando se ejecuta en modo aplicación, se agrega un predicado para invocar la entrada de voz de Chrome. Llame al SDK de reconocimiento de voz local, como plus.speech. Es un modelo fascinante que es mejor para los usuarios y más económico para los desarrolladores.
Por supuesto, lo que es más sorprendente que otros productos similares es la capacidad de HBuilder para operar miles de API nativas, concretamente objetos nativos de Obj-C y Android, escribiendo código JS.
CSDN: ¿Cuáles son los problemas con HTML5 en el desarrollo de aplicaciones multiplataforma?
Ann Wang: El futuro es brillante, pero hay cuatro deficiencias fatales que impiden su explosión: la insuficiencia de "sexo, función y energía" y una grave fragmentación. En comparación con las nativas, el rendimiento de las aplicaciones HTML5 es bajo, las herramientas son deficientes y las capacidades son débiles. Aunque no es multiplataforma de forma nativa, la compatibilidad del navegador HTML5 también hace que los desarrolladores se rasquen la cabeza. Para resolver estos problemas, HBuilder ha hecho muchos esfuerzos.
1. La primera es la herramienta
HBuilder mejora enormemente la eficiencia del desarrollo HTML5. También cuenta con la biblioteca más completa y actualizada de la nueva sintaxis HTML5. Una semana después de la actualización de la versión del navegador, HBuilder podrá mostrar la nueva sintaxis.
Otro propósito de la búsqueda de velocidad de HBuilder es reducir la dependencia de los desarrolladores de los marcos, que son muy populares en la Web de PC y pueden simplificar el desarrollo. Sin embargo, el desarrollo simplificado del marco se basa en la degradación del rendimiento de HTML5 en los teléfonos móviles, y la encapsulación de capas solo se volverá cada vez más lenta. Pero los desarrolladores que usan HBuilder encontrarán que desarrollar en HBuilder sin un marco es más rápido que usar otros editores de desarrollo con marcos.
Las principales herramientas de desarrollo HTML5 actuales carecen de funciones de teléfonos móviles, como la depuración de dispositivos reales, cuando se actualizan. HBuilder proporciona estas funciones para ayudar de manera efectiva a los desarrolladores a desarrollar bibliotecas de sintaxis de aplicaciones móviles.
2. Compatibilidad del navegador
Compatibilidad del navegador
Debido a los diferentes núcleos del navegador, la velocidad de expansión de su propia sintaxis excede la velocidad de agregar nueva sintaxis, lo que lleva. ¡A una fragmentación muy grave! HBuilder tiene declaraciones de compatibilidad de navegadores para cada sintaxis y es la base de datos de compatibilidad de navegadores más completa disponible. Vea la imagen a continuación. El valor del campo de atributo -webkit-user-select es todo. IE y Firefox, naturalmente, no lo admiten y el ícono es gris. Pero Chrome admite el mismo kernel de webkit; aunque el navegador de Android no lo admite, el ícono es gris. Safari solo es compatible con la versión 7.0 o superior y el ícono es medio brillante;
Algunas personas dicen que los teléfonos móviles no deberían tener problemas de compatibilidad porque todos son navegadores basados en webkit.
Pero la imagen de arriba les muestra a los desarrolladores un hecho cruel: los tres navegadores móviles principales, iOS, Safari, el navegador de Android y la versión de Android del navegador Chrome, tienen problemas de compatibilidad. Google y Apple unieron fuerzas para romper el monopolio de IE, y luego comenzaron a divergir. Chrome lanzó el motor Blink el año pasado y comenzó a expandir la sintaxis de forma independiente. Además, aunque existe una pequeña diferencia entre la versión para Mac de Safari y la versión para iOS, no es grande, y la versión para Android del navegador Chrome y el navegador que viene con el sistema Android son dos productos completamente diferentes; Como desarrollador, incluso extraño los días en que IE tenía el monopolio del mercado.
Hemos trabajado duro para crear esta biblioteca de compatibilidad de navegadores con la esperanza de que sea útil para los desarrolladores.
3. Función
La ventaja de la especificación HTML5 es que es multiplataforma, pero la desventaja es que la función de especificación es mucho peor que la función local. Para resolver este problema, introdujimos dos conjuntos de programas:
Especificación multiplataforma HTML5+: las funciones de teléfonos móviles comúnmente utilizadas por los desarrolladores están encapsuladas en la especificación HTMLplus.org, incluidos códigos QR, entrada de voz, etc., como Ingrese plus.barcode en JS para llamar al código QR. Por ejemplo, ingrese plus.barcode en JS para llamar al código QR e ingrese plus.speech para llamar a la entrada de voz. Desarrolle una vez y ejecútelo en diferentes teléfonos.
JS llama directamente a la API nativa: proporcionamos dos objetos mágicos, plus.ios y plus.android, para que los desarrolladores de redes no tengan que aprender Obj-C o comprar dispositivos Mac, pueden usar JS Call el objeto nativo. Podemos definir una variable JS como esta, pero en realidad es un objeto Obj-C: Podemos definir una variable JS como esta, pero en realidad es un objeto Obj-C: API nativa directa de JS: proporcionamos plus.ios y plus.roid Estos dos objetos tan mágicos permiten a los desarrolladores web evitar tener que aprender Obj-C o comprar dispositivos Mac. Solo necesitan llamar a objetos locales en JS. Podemos definir una variable JS que en realidad sea un objeto Obj-C así:
var a = plus.ios.implementations("NSObject",{"authenticationChanged:":authenticationChanged});
O así: var Intent = plus.android.import("android.content.Intent"); donde "android.content.Intent" es la clase nativa de Android. Este código utilizará JS para crear un acceso directo a una aplicación en el escritorio del teléfono Android.
De esta manera, las aplicaciones programadas usando HTML5 son tan poderosas funcionalmente como las aplicaciones nativas. En el pasado, los juegos creados con HTML5 no podían llamar a Game Center y las aplicaciones O2O no podían llamar a Passbook, pero ahora es fácil. Creemos que esta es una gran liberación en funcionalidad y abre una nueva ventana de oportunidades para los ingenieros de redes.
4. Rendimiento
El rendimiento de las aplicaciones HTML5 siempre ha sido un cuello de botella para el desarrollo de la industria.
El rendimiento del hardware móvil es peor que el de las PC. El rendimiento de HTML5 como lenguaje interpretado es peor que el de los lenguajes compilados nativos. Además, el estilo de control predeterminado de los navegadores móviles no está optimizado. la interfaz de usuario debe volver a empaquetarse en la capa de aplicación. En conjunto, estos problemas hacen que el rendimiento sea un problema para todos los desarrolladores de HTML5.
Además, la mayoría de los ingenieros de front-end son expertos en UI y el rendimiento de su código es mucho menor en comparación con los ingenieros de servidores. Por ejemplo, los ingenieros de front-end están muy acostumbrados a usar marcos, y los marcos se vuelven cada vez más lentos en la encapsulación capa por capa, entonces, ¿cómo puede mejorar el rendimiento?
Para resolver este problema, HBuilder dedicó mucho esfuerzo:
a. Llamar a la interfaz dibujada localmente
Hay un subconjunto plus.ui en la especificación HTML5+. Algunos estilos o animaciones nativas, como la animación de paso de página o la actualización desplegable, utilizan HTML5 + JS + css para simular una gran cantidad de código, lo cual es muy lento de implementar. En este momento, puede configurar el área en forma de. un bloque a través de la extensión plus.ui y déjelo en el dibujo nativo. El rendimiento se puede mejorar mucho.
b. Biblioteca de interfaz de usuario orientada al rendimiento
En el pasado, los marcos que afirmaban estar optimizados para teléfonos móviles en realidad no consideraban el rendimiento del producto como la primera prioridad ni la conveniencia de los usuarios. , o el rendimiento de la implementación se sacrifica por la conveniencia del responsable del mantenimiento del marco. Decidimos hacer uno nosotros mismos. Todavía estamos trabajando en este proyecto y estará disponible pronto.
No lo llamamos marco, sino biblioteca de interfaz de usuario, porque el estilo del control utiliza el css class="xxx" más simple. Esta forma de usar clases es mucho más eficiente que escribir una función de datos y reemplazar Dom cuando se ejecuta JS.
Estos controles contienen el código JS necesario y se desarrollan teniendo en cuenta los problemas de rendimiento. El código es extremadamente optimizado y eficiente, no utiliza marcos de trabajo de terceros como $ y es compatible con todos los navegadores. Además, esta biblioteca de interfaz de usuario está profundamente integrada con el empaquetador y el tiempo de ejecución de HBuilder para lograr una mayor optimización del rendimiento.
CSDN: en comparación con escribir una gran cantidad de implementaciones de JS, ¿cuáles son las ventajas de usar JS en HBuilder para llamar a API locales?
Wang An: La mayor ventaja de que JS llame a API nativas es que mejora en gran medida las capacidades de HTML5 y supera las limitaciones de los navegadores. Native tiene cientos de miles de API, muchas más que HTML5. Por ejemplo, interceptar llamadas entrantes a Android.
La eficiencia de ejecución de JS definitivamente sigue siendo menor que la del nativo. Para mejorar el rendimiento, es necesario utilizar los procedimientos anteriores.
Esta tecnología es muy fácil de aprender para los programadores de JS. No necesita aprender el idioma nativo y configurar el entorno de desarrollo. Solo necesita consultar qué usa cada objeto nativo y luego agregar más en JS. El nombre de la clase nativa en .ios o plus.andriod se puede importar a JS como parámetro para llamar al objeto nativo a través de este método.
También creamos una serie de plantillas para código nativo común, incluido código de muestra prediseñado en HBuilder para crear accesos directos e iniciar sesión en Game Center.
CSDN: JS llama a la API local, ¿cómo se implementa esto?
Wang An: Esto es muy complicado. Diferentes API requieren diferentes métodos, y los teléfonos móviles, las nubes y el IDE *** requieren la misma cooperación. El código que se ejecuta cuando el IDE muestra el código, cuando el empaquetador lo compila y cuando el tiempo de ejecución realmente lo ejecuta es diferente.
CSDN: ¿Cuáles son las tendencias en el campo del desarrollo multiplataforma HTML5?
Wang An: No hay duda sobre el brillante futuro de HTML5 cuando Java está bloqueado en iOS y cuando los terminales y las pantallas se vuelven cada vez más diversos, la simplicidad y las características multiplataforma de HTML5 representan el dirección futura.
La pregunta ahora es simplemente cuándo y quién resolverá los problemas que frenan el HTML5. Cuando el rendimiento, las herramientas, la funcionalidad y la compatibilidad se superen de manera efectiva, HTML5 seguramente marcará el comienzo de un desarrollo explosivo.
CSDN: ¿Cuál es el próximo plan de Dcloud para HBuilder?
Wang An: Además del marco de interfaz de usuario móvil de alto rendimiento mencionado anteriormente, HBuilder también introducirá SNS y UGC, fortalecerá el sistema de complementos y trabajará con muchos desarrolladores para crear herramientas y servicios más satisfactorios. . Nos tomamos muy en serio el desarrollo de esta herramienta gratuita y esperamos que todos los desarrolladores puedan participar en el desarrollo de esta herramienta. Actualmente, HBuilder ha establecido 3 proyectos de código abierto en github.com/dcloudio. Todos pueden unirse a nosotros y crear conjuntamente herramientas con las que esté satisfecho.
Reimpreso únicamente como referencia, los derechos de autor pertenecen al autor original.
Te deseo un feliz día y por favor adopta si estás satisfecho
.