10 Años de Vue: el Pasado y el Futuro

Rate this content
Bookmark

Vue fue anunciado públicamente por primera vez en 2014 y cumple 10 años este año! En esta charla, echaremos un vistazo juntos a cómo ha cambiado y evolucionado desde sus humildes comienzos, discutiremos algunos de los desafíos y aprendizajes, y cómo pensamos en su futuro.

This talk has been presented at Vue.js Live 2024, check out the latest edition of this JavaScript Conference.

Evan You
Evan You
29 min
25 Apr, 2024

Comments

Sign in or register to post your comment.
  • Hodadis  Birhan
    Hodadis Birhan
    This a great showcase for vue communities and developers how the Vue is improved with promising features that help developers to build best performance and secured web application easily.

Video Summary and Transcription

Hola a todos y bienvenidos a Vue.js Live 2024. En esta Charla, Evan Yew, el creador de Vue y Vite, comparte una retrospectiva de 10 años sobre Vue.js, discutiendo su historia, impacto técnico y cómo se mantiene vivo. Vue ha realizado contribuciones significativas al ecosistema de JavaScript y es el único marco de trabajo principal que sigue siendo independiente. La última versión, Vue 3.4, introdujo mejoras de rendimiento y un sistema de reactividad más eficiente. Los planes futuros incluyen mejoras en la eficiencia de la reactividad, estabilización de props reactivos y exploración del modo vapor. Vue está aquí para quedarse y continuará apoyando a la comunidad.

1. Introducción a Vue.js Live 2024

Short description:

Hola a todos y bienvenidos a Vue.js Live 2024. Soy Evan Yew, el creador de Vue y Vite. Hoy estoy muy emocionado de compartir con ustedes una retrospectiva de 10 años sobre Vue.js. Vue ya tiene 10 años. En esta charla, veremos la historia de Vue, su impacto técnico y cómo lo mantenemos vivo. Vue tiene más de 9,326 commits, 493 versiones lanzadas, 2 millones de usuarios en todo el mundo, 250,000 estrellas en GitHub, 4.9 millones de descargas semanales de npm y 1 billón de solicitudes mensuales de CDN en jsdeliver. Vue fue el primer framework en implementar la reactividad basada en seguimiento, combinar componentes de un solo archivo con herramientas de compilación y explorar un sistema de reactividad impulsado por el compilador. Vue también admite tanto el renderizado con plantillas como el renderizado con funciones de virtual DOM.

Hola a todos y bienvenidos a Vue.js Live 2024. Soy Evan Yew, el creador de Vue y Vite. Hoy estoy muy emocionado de compartir con ustedes una retrospectiva de 10 años sobre Vue.js. Sí, escucharon bien. Vue ya tiene 10 años. Suena como mucho tiempo en el mundo del front-end. Y, por supuesto, Vue ya no es una tecnología nueva, pero en esta charla veremos parte de su historia y también veremos lo que estamos haciendo para mantenerlo vivo y en buen estado. Bien, vamos directo al grano. En primer lugar, algunos números sobre Vue hoy en día. Aquí están algunas estadísticas combinadas de Vue.js y Vue Core en GitHub. Hoy tenemos más de 9,326 commits en los dos repositorios. Hemos lanzado más de 493 versiones de Vue. Tenemos más de 2 millones de usuarios en todo el mundo, 250,000 estrellas en GitHub, 4.9 millones de descargas semanales de npm y más de 1 billón de solicitudes mensuales de CDN en jsdeliver. También queremos hablar sobre el impacto técnico de Vue, porque a pesar de usarlo a diario, tal vez muchos usuarios nuevos hoy no están tan familiarizados con su historia y con las ideas que surgieron de Vue y que también han influido en otras tecnologías, ¿verdad? En 2014, Vue fue el primer framework de JavaScript en implementar la reactividad basada en seguimiento profundo. Ahora, la reactividad basada en seguimiento es un paradigma que se remonta a Knockout.js y Meteor Tracker. Es una tecnología aún más antigua que Vue, pero Vue fue el primero en aplicar este principio a objetos profundos. Por lo tanto, puedes mutar un objeto y las cosas simplemente funcionan, y Vue fue el primer framework en hacerlo. Vue también fue el primer framework en combinar la idea de componentes de un solo archivo con herramientas de compilación. La idea de componentes de un solo archivo no es necesariamente nueva. De hecho, hubo un proyecto interno en Google cuando trabajaba allí que fue una fuente de inspiración. Pero Vue fue el primero en combinar esta idea con una herramienta de compilación llamada Browserify en el backend, y más tarde también admitimos Webpack. Pero la capacidad de utilizar lenguajes adicionales en estos bloques de script, plantilla o estilo, es única. Por lo tanto, antes podías usar CoffeeScript, hoy en día principalmente puedes usar TypeScript, puedes usar SAS, LASP, preprocesadores, puedes usar PostCSS para procesar tu CSS, incluso puedes usar POD, que antes se llamaba Jade, para diferentes plantillas en texto con plantillas. Por lo tanto, Vue fue el primer framework en admitir este tipo de uso. Y la API de Composición fue la primera en combinar la reactividad estilo Signo, que es también la reactividad basada en seguimiento de la que hablamos antes, con modelos de componentes modernos. Por lo tanto, puedes usar referencias de Vue en una sintaxis de configuración de script con modelos de componentes modernos, y Vue fue el primero en combinar ese modelo en el modelo de componente que todos conocemos hoy en día. Vue también fue el primero en explorar un azúcar de reactividad impulsado por el compilador para Signos en forma de la transformación de reactividad, que fue una propuesta experimental con la que trabajamos durante un período de tiempo, pero al final decidimos que no era la mejor dirección para Vue. Sin embargo, estamos muy contentos de ver que esta dirección está siendo adoptada por otros frameworks, por ejemplo, Svelte 5, que también está explorando esta dirección. Por lo tanto, podría ser más adecuado para Svelte, pero creemos que Vue está en un lugar bastante bueno con su propio paradigma. Ahora, Vue también es único en el sentido de que admite tanto el renderizado con plantillas como el renderizado con funciones de virtual DOM.

2. Impacto y Cronología de Vue

Short description:

Vue ofrece un equilibrio entre la sintaxis de plantillas y las funciones de renderizado manual. Vue fue el pionero en el concepto de un framework progresivo, permitiendo una adopción incremental. La cronología de Vue incluye el primer lanzamiento en 2013, alcanzando la versión 1.0 en 2015 y la reescritura principal en la versión 2.0 en 2016. El trabajo en Vue 3 comenzó en 2018 y se lanzó suavemente en 2020 antes de convertirse en la versión predeterminada en 2022. Vue 2 llegó al final de su vida útil en 2023. El ciclo de adopción de tecnología incluye desencadenantes, expectativas, desilusión, iluminación y productividad.

Esto ofrece un buen equilibrio que brinda familiaridad a los usuarios que prefieren la sintaxis de plantillas y una experiencia de desarrollo más fluida para las personas que prefieren las plantillas con estilo HTML. Pero al mismo tiempo, en casos de uso avanzados y para los autores de bibliotecas, aún puedes omitir la capa de plantillas y escribir funciones de renderizado manualmente, lo que te brinda mucha más flexibilidad para realizar funciones avanzadas. Y finalmente, Vue fue el pionero en el concepto de un framework progresivo, la idea de un framework que no es monolítico, la idea de que un framework puede estar compuesto por piezas individuales pero con un diseño coherente que puedes adoptar y usar de forma incremental según tus necesidades del framework. Creo que Vue es el primero en pionerar esta idea y también es el único que la ha implementado realmente bien. Ahora, mirando hacia atrás, aquí tienes una breve cronología de lo que hizo Vue. Hicimos el primer lanzamiento con el nombre de Vue.js en 2013. Esa fue la primera vez que apareció el nombre de Vue.js. Pero el anuncio público fue en febrero de 2014. Permaneció como un proyecto secundario para mí durante mucho tiempo y me llevó bastante tiempo pulirlo lo suficiente como para sentirme cómodo y seguro de compartirlo con el mundo. En octubre de 2015, alcanzamos la versión 1.0. En realidad, me tomé un largo descanso para impulsarlo hacia la versión 1.0. Y después de la versión 1.0, la sintaxis de plantillas se estableció en gran medida. En la versión 2.0, hicimos la reescritura principal, en la que implementamos el renderizado utilizando el virtual DOM, y se lanzó en octubre de 2016. 2016 también fue el año en que comencé a trabajar en Vue a tiempo completo. Ahora, el trabajo en Vue 3 realmente comenzó en septiembre de 2018. Eso fue hace mucho tiempo. Pero 3.0 tomó mucho, mucho más tiempo de lo esperado debido a la magnitud de los cambios y el impacto en el ecosistema que creó. Vue 2 ya se usaba ampliamente y el trabajo en 3.0 fue un proceso de aprendizaje para nosotros. Definitivamente hubo altibajos, se cometieron errores y se aprendieron lecciones. Por lo tanto, 3.0 se lanzó suavemente en septiembre de 2020 y finalmente se convirtió en la versión predeterminada en enero de 2022. Todo el proceso llevó algunos años. Pero estamos muy contentos de que el ecosistema finalmente haya adoptado Vue 3 y veremos algunas estadísticas más adelante. Por lo tanto, Vue 2 ha alcanzado oficialmente el final de su vida útil en diciembre de 2023. Realmente animamos a los usuarios que todavía están en Vue 2 a considerar la actualización, o deben buscar el soporte relevante para mantener sus versiones de Vue 2 en funcionamiento. Ahora, este fue realmente un momento nostálgico en el que todavía tengo esta publicación de blog en algún lugar hablando sobre la primera semana de lanzamiento de Vue.js y estaba muy feliz de haber obtenido unos cientos de estrellas en GitHub en la primera semana, lo cual fue un gran logro para mí en ese entonces. Pero después del lanzamiento inicial, hubo momentos, altibajos donde la realidad golpea. No sé si alguien ha oído hablar del ciclo de adopción de tecnología. Cuando se lanza una nueva tecnología, hay un desencadenante tecnológico. Hay un pico de expectativas infladas. Luego está la prueba de desilusión, la pendiente de iluminación y finalmente se alcanza la meseta de productividad.

QnA

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

Construyendo Mejores Sitios Web con Remix
React Summit Remote Edition 2021React Summit Remote Edition 2021
33 min
Construyendo Mejores Sitios Web con Remix
Top Content
Remix is a web framework built on React Router that focuses on web fundamentals, accessibility, performance, and flexibility. It delivers real HTML and SEO benefits, and allows for automatic updating of meta tags and styles. It provides features like login functionality, session management, and error handling. Remix is a server-rendered framework that can enhance sites with JavaScript but doesn't require it for basic functionality. It aims to create quality HTML-driven documents and is flexible for use with different web technologies and stacks.
Todo Más Allá de la Gestión de Estado en Tiendas con Pinia
Vue.js London Live 2021Vue.js London Live 2021
34 min
Todo Más Allá de la Gestión de Estado en Tiendas con Pinia
Top Content
State management is not limited to complex applications and transitioning to a store offers significant benefits. Pinia is a centralized state management solution compatible with Vue 2 and Vue 3, providing advanced devtools support and extensibility with plugins. The core API of Pinia is similar to Vuex, but with a less verbose version of stores and powerful plugins. Pinia allows for easy state inspection, error handling, and testing. It is recommended to create one file per store for better organization and Pinia offers a more efficient performance compared to V-rex.
Acelerando tu aplicación React con menos JavaScript
React Summit 2023React Summit 2023
32 min
Acelerando tu aplicación React con menos JavaScript
Top Content
Mishko, the creator of Angular and AngularJS, discusses the challenges of website performance and JavaScript hydration. He explains the differences between client-side and server-side rendering and introduces Quik as a solution for efficient component hydration. Mishko demonstrates examples of state management and intercommunication using Quik. He highlights the performance benefits of using Quik with React and emphasizes the importance of reducing JavaScript size for better performance. Finally, he mentions the use of QUIC in both MPA and SPA applications for improved startup performance.
Documentación Full Stack
JSNation 2022JSNation 2022
28 min
Documentación Full Stack
Top Content
The Talk discusses the shift to full-stack frameworks and the challenges of full-stack documentation. It highlights the power of interactive tutorials and the importance of user testing in software development. The Talk also introduces learn.svelte.dev, a platform for learning full-stack tools, and discusses the roadmap for SvelteKit and its documentation.
Bienvenido a Nuxt 3
Vue.js London Live 2021Vue.js London Live 2021
29 min
Bienvenido a Nuxt 3
Top Content
Nux3 has made significant improvements in performance, output optimization, and serverless support. Nuxt Bridge brings the Nitro engine for enhanced performance and easier transition between Nuxt 2 and Nuxt Read. Nuxt 3 supports Webpack 5, Bytes, and Vue 3. NextLab has developed brand new websites using Docus technology. Nuxt.js is recommended for building apps faster and simpler, and Nuxt 2 should be used before migrating to Nuxt 3 for stability. DOCUS is a new project that combines Nuxt with additional features like content modules and an admin panel.
Un Año en Vue 3
Vue.js London Live 2021Vue.js London Live 2021
20 min
Un Año en Vue 3
Top Content
Vue 3 has seen significant adoption and improvements in performance, bundle size, architecture, and TypeScript integration. The ecosystem around Vue 3 is catching up, with new tools and frameworks being developed. The Vue.js.org documentation is undergoing a complete overhaul. PNIA is emerging as the go-to state management solution for Vue 3. The options API and composition API are both viable options in Vue 3, with the choice depending on factors such as complexity and familiarity with TypeScript. Vue 3 continues to support CDN installation and is recommended for new projects.

Workshops on related topic

Vue3: Desarrollo Moderno de Aplicaciones Frontend
Vue.js London Live 2021Vue.js London Live 2021
169 min
Vue3: Desarrollo Moderno de Aplicaciones Frontend
Top Content
Featured WorkshopFree
Mikhail Kuznetcov
Mikhail Kuznetcov
Vue3 fue lanzado a mediados de 2020. Además de muchas mejoras y optimizaciones, la principal característica que trae Vue3 es la API de Composición, una nueva forma de escribir y reutilizar código reactivo. Aprendamos más sobre cómo usar la API de Composición de manera eficiente.

Además de las características principales de Vue3, explicaremos ejemplos de cómo usar bibliotecas populares con Vue3.

Tabla de contenidos:
- Introducción a Vue3
- API de Composición
- Bibliotecas principales
- Ecosistema Vue3

Requisitos previos:
IDE de elección (Inellij o VSC) instalado
Nodejs + NPM
Construyendo aplicaciones web que iluminan Internet con QwikCity
JSNation 2023JSNation 2023
170 min
Construyendo aplicaciones web que iluminan Internet con QwikCity
Featured WorkshopFree
Miško Hevery
Miško Hevery
Construir aplicaciones web instantáneas a gran escala ha sido elusivo. Los sitios del mundo real necesitan seguimiento, análisis y interfaces y interacciones de usuario complejas. Siempre comenzamos con las mejores intenciones pero terminamos con un sitio menos que ideal.
QwikCity es un nuevo meta-framework que te permite construir aplicaciones a gran escala con un rendimiento de inicio constante. Veremos cómo construir una aplicación QwikCity y qué la hace única. El masterclass te mostrará cómo configurar un proyecto QwikCity. Cómo funciona el enrutamiento con el diseño. La aplicación de demostración obtendrá datos y los presentará al usuario en un formulario editable. Y finalmente, cómo se puede utilizar la autenticación. Todas las partes básicas para cualquier aplicación a gran escala.
En el camino, también veremos qué hace que Qwik sea único y cómo la capacidad de reanudación permite un rendimiento de inicio constante sin importar la complejidad de la aplicación.
De vuelta a las raíces con Remix
React Summit 2023React Summit 2023
106 min
De vuelta a las raíces con Remix
Featured Workshop
Alex Korzhikov
Pavlik Kiselev
2 authors
La web moderna sería diferente sin aplicaciones ricas del lado del cliente respaldadas por potentes frameworks: React, Angular, Vue, Lit y muchos otros. Estos frameworks se basan en JavaScript del lado del cliente, que es su núcleo. Sin embargo, existen otros enfoques para el renderizado. Uno de ellos (bastante antiguo, por cierto) es el renderizado del lado del servidor completamente sin JavaScript. Descubramos si esta es una buena idea y cómo Remix puede ayudarnos con ello?
Prerrequisitos- Buen entendimiento de JavaScript o TypeScript- Sería útil tener experiencia con React, Redux, Node.js y escribir aplicaciones FrontEnd y BackEnd- Preinstalar Node.js, npm- Preferimos usar VSCode, pero también se pueden utilizar IDE en la nube como codesandbox (otros IDE también están bien)
Usando Nitro - Construyendo una Aplicación con el Último Motor de Renderizado de Nuxt
Vue.js London Live 2021Vue.js London Live 2021
117 min
Usando Nitro - Construyendo una Aplicación con el Último Motor de Renderizado de Nuxt
Top Content
Workshop
Daniel Roe
Daniel Roe
Construiremos un proyecto Nuxt juntos desde cero usando Nitro, el nuevo motor de renderizado de Nuxt, y Nuxt Bridge. Exploraremos algunas de las formas en que puedes usar y desplegar Nitro, mientras construimos una aplicación juntos con algunas de las restricciones del mundo real que enfrentarías al desplegar una aplicación para tu empresa. En el camino, dispara tus preguntas hacia mí y haré lo mejor para responderlas.
Monitoreo 101 para Desarrolladores de React
React Summit US 2023React Summit US 2023
107 min
Monitoreo 101 para Desarrolladores de React
Top Content
WorkshopFree
Lazar Nikolov
Sarah Guthals
2 authors
Si encontrar errores en tu proyecto frontend es como buscar una aguja en un pajar de código, entonces el monitoreo de errores de Sentry puede ser tu detector de metales. Aprende los conceptos básicos del monitoreo de errores con Sentry. Ya sea que estés ejecutando un proyecto de React, Angular, Vue, o simplemente JavaScript “vainilla”, mira cómo Sentry puede ayudarte a encontrar el quién, qué, cuándo y dónde detrás de los errores en tu proyecto frontend.
Nivel de la masterclass: Intermedio
Embarcándonos en una aventura con Nuxt 3, Motion UI y Azure
JSNation 2022JSNation 2022
141 min
Embarcándonos en una aventura con Nuxt 3, Motion UI y Azure
WorkshopFree
Melanie de Leeuw
Melanie de Leeuw
¡Nos encantan las aplicaciones web fáciles de crear y desplegar! Entonces, veamos qué puede hacer una pila tecnológica muy actual como Nuxt 3, Motion UI y Azure Static Web Apps. Podría ser perfectamente un trío de oro en el desarrollo web moderno. O podría ser una hoguera de errores y problemas. De cualquier manera, será una aventura de aprendizaje para todos nosotros. Nuxt 3 se lanzó hace apenas unos meses y no podemos esperar más para explorar sus nuevas características, como su compatibilidad con Vue 3 y el Motor Nitro. Agregamos un poco de estilo a nuestra aplicación con la biblioteca Sass Motion UI, porque el diseño estático está pasado de moda y las animaciones vuelven a estar de moda.Nuestra fuerza impulsora de la pila será Azure. Las aplicaciones web estáticas de Azure son nuevas, casi listas para producción y una forma ingeniosa y rápida para que los desarrolladores desplieguen sus sitios web. Así que, por supuesto, debemos probar esto.Con algunas Azure Functions esparcidas por encima, exploraremos lo que puede hacer el desarrollo web en 2022.