6 puntos por xguru 2024-09-06 | 3 comentarios | Compartir por WhatsApp
  • Esta versión menor incluye mejoras internas y nuevas funciones útiles, sin cambios incompatibles con versiones anteriores

Optimización del sistema de reactividad

  • El sistema de reactividad de Vue fue refactorizado a gran escala para mejorar el rendimiento y el uso de memoria (-56%), sin cambios en el comportamiento
  • La refactorización también resuelve problemas de valores computados y memoria durante SSR
  • En 3.5, se optimizó el seguimiento de reactividad para arreglos reactivos grandes y profundos, logrando en algunos casos hasta 10 veces más velocidad

Desestructuración reactiva de props

  • La desestructuración reactiva de props se estabilizó en 3.5 y ahora está habilitada por defecto
  • En <script setup>, las variables desestructuradas desde una llamada a defineProps ahora son reactivas
  • Esta función simplifica mucho la declaración de props con valores predeterminados al aprovechar la sintaxis nativa de valores por defecto de JavaScript

Mejoras en SSR

Hidratación diferida

  • Los componentes asíncronos ahora pueden controlar cuándo hidratarse especificando una estrategia mediante la opción hydrate de la API defineAsyncComponent()

useId()

  • useId() es una API que puede usarse para generar IDs únicos por aplicación, garantizados de forma estable tanto en renderizado del servidor como del cliente
  • Puede usarse para generar IDs de elementos de formularios y atributos de accesibilidad, y puede utilizarse en aplicaciones SSR sin desajustes de hidratación

data-allow-mismatch

  • Cuando un valor del cliente inevitablemente será distinto del valor del servidor (por ejemplo, una fecha), se puede suprimir la advertencia de desajuste de hidratación con el atributo data-allow-mismatch
  • También se puede limitar el tipo de desajuste permitido proporcionando un valor al atributo (text, children, class, style, attribute)

Mejoras en elementos personalizados

  • La versión 3.5 corrige muchos problemas de larga data relacionados con la API defineCustomElement() y agrega varias funciones nuevas para crear elementos personalizados con Vue
  • Soporta configuración de la aplicación para elementos personalizados mediante la opción configureApp
  • Agrega las APIs useHost(), useShadowRoot() y this.$host para acceder al elemento host y al shadow root de elementos personalizados
  • Soporta montar elementos personalizados sin Shadow DOM pasando shadowRoot: false
  • Soporta proporcionar la opción nonce, que se adjunta a las etiquetas <style> inyectadas por el elemento personalizado

Otras funciones destacadas

useTemplateRef()

  • La versión 3.5 introduce una nueva forma de obtener referencias de plantilla mediante la API useTemplateRef()
  • Antes de 3.5, se recomendaba usar una referencia normal haciendo coincidir el nombre de la variable con un atributo ref estático
  • El enfoque anterior estaba limitado a atributos ref estáticos porque el compilador debía poder analizar el atributo ref
  • En comparación, useTemplateRef() hace coincidir referencias mediante un ID de cadena en tiempo de ejecución, por lo que admite enlaces dinámicos de referencias para IDs cambiantes

Teleport diferido

  • Una limitación conocida del componente integrado <Teleport> era que el elemento de destino debía existir cuando el componente teleport se montaba
  • Esto impedía que los usuarios hicieran teleport de contenido hacia otro elemento renderizado por Vue
  • En 3.5 se introduce la prop defer para <Teleport>, que se monta después del ciclo de renderizado actual, por lo que ahora esto ya funciona

onWatcherCleanup()

  • La versión 3.5 introduce onWatcherCleanup(), una API importada globalmente para registrar callbacks de limpieza en watchers

3 comentarios

 
[Este comentario fue ocultado.]
 
narusas 2024-09-06

En esta versión, la comodidad al desarrollar componentes en la práctica sí aumentó muchísimo.

 
xguru 2024-09-06

Parece que el nombre de esta versión es "Tengen Toppa Gurren Lagann". (¡Es una obra maestra! Creo que esto fue lo último de Gainax que vi)

Vue, de forma tradicional, ha tomado títulos de anime/manga para sus versiones. La 1.0 fue Evangelion, la 2.0 Ghost in the Shell, la 3.0 One Piece, la 3.3 Rurouni Kenshin, y la 3.4 Slam Dunk
https://en.wikipedia.org/wiki/Vue.js#Versions