Hoy estamos orgullosos de anunciar el lanzamiento oficial de Vue.js 3.0 “One Piece”. Esta nueva versión principal del marco proporciona un rendimiento mejorado, tamaños de paquete más pequeños, una mejor integración de TypeScript, nuevas API para abordar casos de uso a gran escala y una base sólida para iteraciones futuras a largo plazo del marco.

La versión 3.0 representa más de 2 años de esfuerzos de desarrollo, con más de 30 RFC , más de 2600 confirmaciones, 628 solicitudes de extracción de 99 colaboradores , además de una enorme cantidad de trabajo de desarrollo y documentación fuera del repositorio principal. Nos gustaría expresar nuestro más profundo agradecimiento a los miembros de nuestro equipo por asumir este desafío, a nuestros colaboradores por las solicitudes de extracción, a nuestros patrocinadores y patrocinadores por el apoyo financiero, y a la comunidad en general por participar en nuestras discusiones de diseño y proporcionar comentarios para el pre -versiones de lanzamiento. Vue es un proyecto independiente creado para la comunidad y sostenido por la comunidad, y Vue 3.0 no hubiera sido posible sin su apoyo constante.

Llevando más lejos el concepto de “marco progresivo”

Vue tenía una misión simple desde su humilde comienzo: ser un marco accesible que cualquiera pueda aprender rápidamente. A medida que nuestra base de usuarios creció, el marco también creció en alcance para adaptarse a las crecientes demandas. Con el tiempo, evolucionó hasta convertirse en lo que llamamos un “marco progresivo”: un marco que se puede aprender y adoptar gradualmente, al tiempo que proporciona un apoyo continuo a medida que el usuario se enfrenta a escenarios cada vez más exigentes.

Hoy en día, con más de 1.3 millones de usuarios en todo el mundo * , vemos que Vue se usa en una gama muy diversa de escenarios, desde la interactividad en las páginas tradicionales representadas por el servidor, hasta aplicaciones completas de una sola página con cientos de componentes. Vue 3 lleva esta flexibilidad aún más lejos.

Módulos internos en capas

El núcleo de Vue 3.0 aún se puede usar a través de una <script>etiqueta simple , pero sus componentes internos se han reescrito desde cero en una colección de módulos desacoplados . La nueva arquitectura proporciona una mejor capacidad de mantenimiento y permite a los usuarios finales reducir hasta la mitad del tamaño del tiempo de ejecución mediante la agitación de árboles.

Estos módulos también exponen API de nivel inferior que desbloquean muchos casos de uso avanzados:

  • El compilador admite transformaciones AST personalizadas para personalizaciones en tiempo de compilación (p. Ej. , I18n en tiempo de compilación )
  • El motor de ejecución principal proporciona una API de primera clase para crear renderizadores personalizados dirigidos a diferentes destinos de renderizado (por ejemplo , dispositivos móviles nativos , WebGL o terminales ). El renderizador DOM predeterminado se crea utilizando la misma API.
  • El @vue/reactivitymódulo exporta funciones que brindan acceso directo al sistema de reactividad de Vue y se puede usar como un paquete independiente. Se puede usar para emparejar con otras soluciones de plantillas (por ejemplo, lit-html ) o incluso en escenarios sin interfaz de usuario.

Nuevas API para abordar la escala

La API basada en objetos 2.x está prácticamente intacta en Vue 3. Sin embargo, 3.0 también presenta la API de composición , un nuevo conjunto de API destinadas a abordar los puntos débiles del uso de Vue en aplicaciones a gran escala. La API de composición se basa en la API de reactividad y permite la composición lógica y la reutilización de forma similar a los ganchos de React, patrones de organización de código más flexibles y una inferencia de tipos más confiable que la API basada en objetos 2.x.

La API de composición también se puede usar con Vue 2.x a través del complemento @ vue / composicion-api , y ya existen bibliotecas de utilidades de API de composición que funcionan para Vue 2 y 3 (por ejemplo , vueuse , vue-composable ).

Mejoras de rendimiento

Vue 3 ha demostrado mejoras de rendimiento significativas con respecto a Vue 2 en términos de tamaño de paquete (hasta un 41% más ligero con sacudidas de árboles), renderizado inicial (hasta un 55% más rápido), actualizaciones (hasta un 133% más rápido) y uso de memoria ( hasta un 54% menos).

En Vue 3, hemos adoptado el enfoque de “DOM virtual informado por el compilador”: el compilador de plantillas realiza optimizaciones agresivas y genera un código de función de renderizado que eleva el contenido estático, deja pistas de tiempo de ejecución para los tipos de enlace y, lo más importante, aplana los nodos dinámicos dentro una plantilla para reducir el costo del recorrido en tiempo de ejecución. Por lo tanto, el usuario obtiene lo mejor de ambos mundos: rendimiento optimizado para el compilador a partir de plantillas o control directo a través de funciones de renderizado manual cuando el caso de uso lo requiere.

Integración con TypeScript mejorada

El código base de Vue 3 está escrito en TypeScript, con definiciones de tipos generadas, probadas y empaquetadas automáticamente para que estén siempre actualizadas. La API de composición funciona muy bien con la inferencia de tipos. Vetur, nuestra extensión oficial de VSCode, ahora es compatible con la expresión de plantilla y la verificación de tipos de accesorios aprovechando la escritura interna mejorada de Vue 3. Ah, y la escritura de Vue 3 es totalmente compatible con TSX si esa es su preferencia.

Funciones experimentales

Hemos propuesto dos características nuevas para los componentes de archivos singulares (SFC, también conocidos como .vuearchivos):

Estas funciones ya están implementadas y disponibles en Vue 3.0, pero se proporcionan solo con el propósito de recopilar comentarios. Seguirán siendo experimentales hasta que se fusionen las RFC.

También hemos implementado un <Suspense>componente actualmente no documentado , que permite esperar en dependencias asíncronas anidadas (componentes asíncronos o componente con async setup()) en el procesamiento inicial o cambio de rama. Estamos probando e iterando sobre esta función con el equipo de Nuxt.js ( Nuxt 3 está en camino ) y probablemente la solidifiquemos en 3.1.

Proceso de lanzamiento por fases

El lanzamiento de Vue 3.0 marca la preparación general del marco. Si bien algunos de los subproyectos de frameworks aún pueden necesitar más trabajo para alcanzar un estado estable (específicamente la integración de enrutador y Vuex en las herramientas de desarrollo), creemos que es adecuado para comenzar nuevos proyectos de campo nuevo con Vue 3 hoy. También recomendamos a los autores de bibliotecas que comiencen a actualizar sus proyectos para que sean compatibles con Vue 3.

Consulte la Guía de bibliotecas de Vue 3 para obtener detalles sobre todos los subproyectos del marco.

Soporte de migración e IE11

Hemos retrasado la compilación de migración (compilación v3 con comportamiento compatible v2 + advertencias de migración) y la compilación IE11 debido a limitaciones de tiempo, y nuestro objetivo es centrarnos en ellas en el cuarto trimestre de 2020. Por lo tanto, los usuarios que planean migrar una aplicación v2 existente o requieren El soporte de IE11 debe tener en cuenta estas limitaciones en este momento.

Próximos pasos

A corto plazo después del lanzamiento, nos centraremos en:

  • Construcción de migración
  • Soporte IE11
  • Integración de enrutador y Vuex en nuevas herramientas de desarrollo
  • Más mejoras en la inferencia del tipo de plantilla en Vetur

Por el momento, los sitios web de documentación, las sucursales de GitHub y las etiquetas npm dist para los proyectos de orientación Vue 3 y v3 seguirán estando nextsubdenotados. Esto significa npm install vueque todavía instalará Vue 2.xy npm install vue@nextinstalará Vue 3. Estamos planeando cambiar todos los enlaces de documentos, ramas y etiquetas dist a 3.0 por defecto para fines de 2020.

Al mismo tiempo, hemos comenzado a planificar la versión 2.7, que será la última versión menor planificada de la línea de versiones 2.x. 2.7 respaldará mejoras compatibles de la versión 3 y emitirá advertencias sobre el uso de las API que se eliminan o cambian en la versión 3 para ayudar con la posible migración. Estamos planeando trabajar en 2.7 en el primer trimestre de 2021, que se convertirá directamente en LTS al momento del lanzamiento con una vida útil de mantenimiento de 18 meses.

Probándolo

Para obtener más información sobre Vue 3.0, consulte nuestro nuevo sitio web de documentación . Si ya es usuario de Vue 2.x, vaya directamente a la Guía de migración .

Fuente: v3.0.0 de una pieza

 

 

Please follow and like us: