Bun
Incredibly fast JavaScript runtime, bundler, transpiler and package manager – all in one.
Categorías
Proyectos más populares del 2022
1
+36.6k☆
Tendencias en 2022
E
F
M
A
M
J
J
A
S
O
N
D
Datos de GitHub
- Creado2021-04
- Total estrellas37.4k☆
Links
- GitHub
- Home
2
Tauri
Build smaller, faster, and more secure desktop applications with a web frontend.
+30.5k☆
3
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
+19.8k☆
4
Next.js
The React Framework
+19.4k☆
5
Vite
Next generation frontend tooling. It's fast!
+15.5k☆
6
tRPC
Move Fast and Break Nothing. End-to-end typesafe APIs made easy.
+15.2k☆
7
Astro
A website build tool for the modern web — powerful developer experience meets lightweight output.
+15.0k☆
8
VS Code
Visual Studio Code
+15.0k☆
9
Tabby
A terminal for a more modern age
+14.4k☆
10
Playwright
A framework for Web Testing and Automation. It allows testing Chromium, Firefox and WebKit with a single API.
+14.3k☆
Frameworks Front-end
1
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
+19.8k☆
2
Qwik
The HTML-first framework. Instant apps of any size with ~ 1kb JS
+12.8k☆
3
Solid
A declarative, efficient, and flexible JavaScript library for building user interfaces.
+11.1k☆
4
Svelte
Cybernetically enhanced web apps
+10.0k☆
5
Vue.js 2
A progressive, incrementally-adoptable framework for building UI on the web
+9.7k☆
React continúa siendo el rey en 2022, pero Vue.js le sigue muy de cerca en términos de popularidad si consideremos que la estrellas de Vue.js están divididas entre dos repositorios: v2 y v3.
El cambio principal de este año es el crecimiento de Qwik, llegando hasta la segunda posición. Qwik se parece a React, también usa componentes escritos en JSX sin embargo, la principal diferencia es su énfasis en intentar incluir la menor cantidad de código JavaScript en el navegador.
Forma parte de la tendencia "Zero baseline JavaScript". Sitios y aplicaciones web están muchas veces cargados de ficheros JavaScript pesados que afectan al rendimiento en el navegador: incluso si la página se renderiza en el servidor los usuarios tienen que esperar hasta que el código JavaScript se cargue, procese y ejecute para poder interactuar con la página.
En vez de depender en hydration para proporcionar interactividad a las páginas generadas en el servidor, Qwik usa una técnica llamada "resumability" que provee HTML que es instantáneamente interactivo. Funciona serializando el estado de la aplicación en el propio HTML.
El proyecto está dirigido por Miško Hevery, creador de AngularJS, que tenía el eslogan "HTML enhanced for web apps", mientras que el de Qwik es "the HTML-first framework"...una intención similar de crear apps encima de nuestro viejo conocido HTML.
Ecosistema React
1
Next.js
The React Framework
+19.4k☆
2
tRPC
Move Fast and Break Nothing. End-to-end typesafe APIs made easy.
+15.2k☆
3
Mantine
React components library with native dark theme support
+12.8k☆
4
Excalidraw
Virtual whiteboard for sketching hand-drawn like diagrams
+12.8k☆
5
Zustand
Bear necessities for state management in React
+12.5k☆
Escritor invitado: Lee Robinson
Lee Robinson es desarrollador, escritor, y creador que trabaja en Vercel como VP de Developer Experience.
2022 ha visto como React ha tomado un posicionamiento más definido en sus formas de usarlo.
React continúa siendo una librería que permite gran flexibilidad para crear cualquier tipo de sitio web, pero también ha evolucionado llegando a convertirse en una arquitectura que los frameworks pueden seguir para crear patrones frontend interactivos, robustos y con buen rendimiento.
El lanzamiento de React 18 (en marzo) incluía funcionalidades concurrentes y APIs que proporcionan patrones de arquitectura para frameworks. Introduce los React Server Components, diseñados para usar en conjunción con estos nuevos patrones de arquitectura. Algunas de las convenciones ya han sido estandarizadas entre los frameworks React (ej. use client) y otros están en proceso (ej. async/await in Server Components) durante sus fases beta.
En 2023, continuaremos viendo usos de las nuevas primitivas de React, además de su aplicación en su amplio ecosistema. El crecimiento de librerías para mejorar un tipado seguro y nuevos componentes UI continuará creciendo.
Ecosistema Vue
1
Slidev
Presentation Slides for Developers
+7.2k☆
2
Nuxt 3
The Intuitive Web Framework, based on Vue 3.
+7.0k☆
3
Vue Element Admin
A magical vue admin
+6.8k☆
4
AutoAnimate
A zero-config, drop-in animation utility that adds smooth transitions to your web app. You can use it with React, Vue, or any other JavaScript application.
+6.4k☆
5
Headless UI
Completely unstyled, fully accessible UI components, designed to integrate beautifully with Tailwind CSS.
+5.9k☆
Escritor invitado: Anthony Fu
Miembro del equipo Core de vuejs, Vite y Nuxt. Creador de VueUse y Slidev.
Este año hemos tenido muchas actualizaciones importantes de Vue. Vue 2.7 incluye soporte de la Composition API y de la sintaxis <script setup> para Vue 2.
La transición a Vue 3 ha sido más sencilla. <script setup> se ha vuelto estable y mayormente disponible, y la nueva funcionalidad experimental "Reactivity Transform" está cerca de consolidarse para mejorar la experiencia de desarrollo aún más. El equipo también está trabajando en una estrategia de rendering llamada "Vapor mode", inspirado por Solid.js, que puede proporcionar a Vue mejor rendimiento en partes críticas.
Las versiones estables de Nuxt 3 y Vuetify 3 indican que el ecosistema de Vue está maduro. Vite ha crecido mucho a lo largo del año y se puede apreciar una buena acogida entre los usuarios de Vue, desde create-vue, Nuxt, Quasar, Astro y muchos otros nuevos frameworks. Con el poder de Vite, los usuarios de Vue también consiguen una mejor experiencia de testing/desarrollo con Vitest y Histoire. También hemos visto un uso creativo de Vue, como crear apps de línea de comandos con vue-termui.
¡Menudo año para las mejoras en la experiencia de desarrollo! Esperamos que la comunidad encuentre estas herramientas útiles para mejorar su forma de trabajo. ¡Estamos expectantes de que vendrá a continuación!
Frameworks Node.js
1
Next.js
The React Framework
+19.4k☆
2
tRPC
Move Fast and Break Nothing. End-to-end typesafe APIs made easy.
+15.2k☆
3
Astro
A website build tool for the modern web — powerful developer experience meets lightweight output.
+15.0k☆
4
create-t3-app
The best way to start a full-stack, typesafe Next.js app
+12.4k☆
5
Remix
Build Better Websites. Create modern, resilient user experiences with web fundamentals.
+11.4k☆
El límite que separa a un framework de ser frontend o backend es fino en muchas ocasiones, ya que hay una tendencia a hacer cada vez más cosas en el lado servidor (incluyendo rendering y routing) comparado con el enfoque SPA, donde el backend es el único responsable de la API. Por esta razón, la sección incluye full-stack, meta y backend frameworks.
Next.js
Al igual que el año pasado, Next.js lidera el ranking. La versión 13 ha traído grandes funcionalidades incluyendo React Server Components y la nueva estructura del sistema de ficheros usando la carpeta app, que permite a los desarrolladores ubicar su código en relación a sus funcionalidades y gestionar rutas anidadas de una forma muy potente.
tRPC
Uno de las novedades ha sido el crecimiento de tRPC, llegando hasta la segunda posición. Olvidémonos de REST contra GraphQL: ahora también aparece el protocolo JSON RPC 2.0 que potencia a tRPC. Una de sus funcionalidades más llamativas es la posibilidad de importar types definidos en el servidor desde el cliente, para proporcionar "end-to-end type safety".
Nos gustaría mencionar también el proyecto t3-stack, que combina tRPC, Next.js y Tailwind CSS en un boilerplate muy popular (dentro de los 20 proyectos más populares del año).
Astro
En tercera posición tenemos a Astro. En 2021 apareció como un static site generator e hizo popular el concepto de partial hydration.
La habilidad del equipo de Astro para crear una buena experiencia de desarrollo se resalta en el lanzamiento de Astro 1.0.
La integración del nuevo soporte para SSR con cualquier herramienta frontend (como React y SCSS) hace que el desarrollo web se sienta muy fresco!
Remix
En cuarto puesto, Remix continúa creciendo a mucha velocidad. Su código fue liberado en 2021 y justo un año después lo adquirió Shopify.
En el post The Web Next Transition Kent C. Dodds hizo un gran trabajo explicando los patrones que hacen Remix tan especial.
En vez de depender en la generación estática de páginas, Remix implementa computación distribuida y funcionalidades nativas del navegador para proporcionar buen rendimiento y experiencia de desarrollo.
Build
1
Vite
Next generation frontend tooling. It's fast!
+15.5k☆
2
Turborepo
Incremental bundler and build system optimized for JavaScript and TypeScript, written in Rust – including Turbopack and Turborepo.
+13.9k☆
3
swc
A super-fast compiler written in rust
+6.4k☆
4
Nx
Smart, Fast and Extensible Build System
+6.0k☆
5
Rome
Unified developer tools for JavaScript, TypeScript, and the web
+5.1k☆
Escritor invitado: Sébastien Lorber
Sébastien lleva usando React desde su aparición, trabaja con Facebook Open-Source en Docusaurus.
Creador de una newsletter semanal sobre React y React Native: This Week in React
Este año Vite continúa creciendo y se ha convertido en uno de las herramientas más populares en el mundo frontend. Su precursor, Snowpack, se ha dejado de mantener y recomiendan usar Vite en su lugar. Su uso no está limitado al ecosistema de Vue: Vite es usado en SvelteKit, Storybook, Vitest o incluso como alternativa moderna a Create-React-App.
También hemos visto un crecimiento de herramientas para monorepo como Nx y Turborepo. Nwrl (la compañía detrás de Nx) ha tomado el mantenimiento de Lerna y lanzado Lerna 6 que activa optimizaciones de Nx por defecto.
Aunque Babel continúa siendo popular, swc y esbuild han sido ampliamente acogidos por muchos proyectos y meta-frameworks. Estas herramientas han mejorado sustancialmente el rendimiento de los procesos de build y transpilación. swc es una opción más modular ofreciendo un sistema de plugins.
Vercel anunció la versión alpha de Turbopack, un nuevo bundler creado con Rust, en el que está trabajando Tobias Koppers (el creador original de Webpack).
El conjunto de herramientas Rome, ha publicado su primera versión estable, comenzando con un linter y formatter con unas opciones interesantes. Por el momento su recibimiento ha sido modesto pero puede que crezca a lo largo del año.
Algunas herramientas frontend creadas con Rust que podrían sorprendernos este año son:
- Lightning CSS (formalmente Parcel CSS): herramientas más rápidas para CSS
- Speedy TypeScript type checker: una alternativa más rápida a tsc
- mdxjs-rs: implementación que mejora la velocidad de MDX
Móvil
1
React Native
A framework for building native applications using React
+6.5k☆
2
Expo
An open-source platform for making universal native apps with React. Expo runs on Android, iOS, and the web.
+2.9k☆
3
React Native Skia
High-performance React Native Graphics using Skia
+2.8k☆
4
Ionic
A powerful cross-platform UI toolkit for building native-quality iOS, Android, and Progressive Web Apps with HTML, CSS, and JavaScript.
+2.6k☆
5
Quasar
Responsive Single Page Apps, Server-side Render Apps, Progressive Web Apps, Hybrid Mobile Apps (that look native!) & Electron Apps, all using the same codebase.
+2.5k☆
Escritor invitado: Evan Bacon
Lead de Desarrollo de Herramientas en Expo. Desarrollador de sistemas nativos iOS y Android. Autor de Config Plugins y Expo CLI.
En 2022, el uso de JavaScript para crear apps nativas vio un progreso significativo, como pudimos comprobar con el éxito de proyectos como el nuevo Replit mobile app y la integración de React Native en la app de Shopify. De hecho, 7 de los 10 rising stars en la categoría móvil de este año están basados en React Native. Lo que ha llevado a React Native a ser, por séptimo año consecutivo, el número 1 en recibir más estrellas a lo largo del año.
Además del éxito de React Native, también hubo una tendencia muy emocionante de adoptar patrones populares del mundo web, como el uso de Tailwind CSS con NativeWind (#10) o los avances en Skia rendering (#3). La integración de funcionalidades clásicas de la web como el File System-based routing en Expo (#2), demostró que el desarrollo de apps nativas se está haciendo cada vez más accesible para desarrolladores web.
Es dificil predecir que futuro le espera al desarrollo móvil, pero si este año sirve de referencia, la división entre desarrollo web y nativo debería de continuar reduciéndose en 2023.
CSS en JavaScript
1
UnoCSS
The instant on-demand atomic CSS engine.
+5.3k☆
2
vanilla-extract
Zero-runtime Stylesheets-in-TypeScript
+2.7k☆
3
Styled Components
Visual primitives for the component age. Use the best bits of ES6 and CSS to style your apps without stress
+2.4k☆
4
Stitches
CSS-in-JS with near-zero runtime, SSR, multi-variant support, and a best-in-class developer experience.
+2.3k☆
5
Emotion
CSS-in-JS library designed for high performance style composition
+1.6k☆
Testing
1
Playwright
A framework for Web Testing and Automation. It allows testing Chromium, Firefox and WebKit with a single API.
+14.3k☆
2
Storybook
A frontend workshop for building UI components and pages in isolation. Made for UI development, testing, and documentation.
+8.0k☆
3
Cypress
Fast, easy and reliable testing for anything that runs in a browser.
+6.8k☆
4
Puppeteer
Headless Chrome Node.js API
+6.0k☆
5
Vitest
A Vite-native test framework. It's fast!
+5.4k☆
Escritorio
1
Tauri
Build smaller, faster, and more secure desktop applications with a web frontend.
+30.5k☆
2
Electron
Build cross-platform desktop apps with JavaScript, HTML, and CSS
+5.6k☆
3
Nativefier
Make any web page a desktop application
+3.0k☆
4
Neutralino
Portable and lightweight cross-platform desktop application development framework
+1.5k☆
5
electron-builder
A complete solution to package and build a ready for distribution Electron app with “auto update” support out of the box
+834☆
SSG
1
Next.js
The React Framework
+19.4k☆
2
Astro
A website build tool for the modern web — powerful developer experience meets lightweight output.
+15.0k☆
3
Docusaurus
Easy to maintain open source documentation websites.
+11.4k☆
4
Nuxt 3
The Intuitive Web Framework, based on Vue 3.
+7.0k☆
5
Nextra
Simple, powerful and flexible site generation framework with everything you love from Next.js.
+2.8k☆
Estado de la aplicación
1
Zustand
Bear necessities for state management in React
+12.5k☆
2
Pinia
Intuitive, type safe, light and flexible Store for Vue using the composition api with DevTools support
+5.0k☆
3
Jotai
Primitive and flexible state management for React
+4.8k☆
4
XState
State machines and statecharts for the modern web.
+3.8k☆
5
Recoil
An experimental state management library for React apps
+2.9k☆
GraphQL
1
TanStack Query
Powerful asynchronous state management, server-state utilities and data fetching for the web. TS/JS, React Query, Solid Query, Svelte Query and Vue Query.
+7.3k☆
2
Directus
A real-time API and App dashboard for managing SQL database content.
+5.9k☆
3
Redwood
The App Framework for Startups
+5.0k☆
4
Hasura GraphQL Engine
Blazing fast, instant realtime GraphQL APIs on your DB with fine grained access control, also trigger webhooks on database events.
+4.0k☆
5
Gatsby
The fastest frontend for the headless web. Build modern websites with React.
+1.9k☆
Conclusión
2022 empezó envuelto en el caos cuando dos paquetes muy populares fueron intencionalmente rotos por su creador: Faker.js and colors.js sabotaged.
La fragilidad de este gran ecosistema quedó demostrada de nuevo cuando Lerna, una herramienta muy conocida para mono-repos dejó de tener mantenimiento...hasta que Nrwl, la compañía detrás de Nx, anunció que se encargaría de ella.
JavaScript continúa arrasando, quizás hayas oído hablar de esta profecía del 2009:
Cualquier aplicación que pueda ser escrita en JavaScript, será escrita en algún momento en JavaScript
...o en TypeScript podríamos añadir 13 años después, ya que TypeScript se ha convertido en el estándar a la hora de escribir JavaScript (soporte por defecto en Deno, Bun, Next.js, Vite...).
El lugar tomado por JavaScript y sus herramientas también tiene sus problemas, tanto para desarrolladores como para los usuarios finales:
- los tiempos de build se disparan en proyectos grandes.
- el tamaño del código JavaScript continúa creciendo llevándonos a un deterioro de rendimiento.
En 2022, vimos grandes innovaciones para resolver estos dos tipos de problemas en diferentes capas del stack tecnológico.
Las herramientas mejoraron con las siguientes soluciones:
- Bun, el campeón del año, toma un enfoque radical mejorando la velocidad de instalación y build.
- Rome es ahora un linter y formatter que intenta ser una sola herramienta para manejar aplicaciones escritas en JS/TS.
- La herramienta de build Vite.
Para mejorar el rendimiento en el navegador, hay diferentes patrones compitiendo:
- Frameworks "Zero baseline JavaScript" que intentan proveer prácticamente nada de JS al navegador (Qwik lidera este frente)
- Partial hydration proporcionando interactividad a páginas estáticas (Astro)
- React Server Components (implementado en Next.js 13 y Gatsby) para delegar más peso en el lado servidor.
- La arquitectura Progressively Enhanced Single Page Apps implementada por Remix proporciona tanto una gran experiencia de desarrollo como buen rendimiento en el navegador sin comprometer ningún comportamiento dinámico.
No hay una fórmula mágica para resolver estos problemas, ya que el espectro entre páginas estáticas y completamente dinámicas es amplio.
El panorama JavaScript ha estado muy fragmentado anteriormente: por un lado teníamos diferentes navegadores y por otro Node.js, con su sistema de módulos CommonJS además de sus propias APIs.
Con el surgimiento del edge computing, hay una tendencia de usar el mismo conjunto de APIs estándar en cualquier lugar (fetch, HTTP Request and Response...).
Nuestro escritor invitado Lee Robinson, hizo un gran resumen de estas tendencias en el artículo Why I'm Optimistic About JavaScript's Future.
Y compartimos totalmente el optimismo de su conclusión!
Que gran momento para ser desarrollador web.
Ganador: Bun 🏆
El proyecto más popular del año es Bun, un nuevo runtime de JavaScript que pone el foco en el rendimiento y la experiencia de desarrollo. Su popularidad aumentó durante el verano con su primera versión Beta: con más de 20,000 estrellas en GitHub en un solo mes, nunca hemos visto un crecimiento tan grande en tan poco tiempo desde que empezamos a analizar proyectos en Best of JS.
Pero, ¿qué tiene Bun de especial? Al igual que Deno, el ganador de hace dos años, provee soporte nativo de TypeScript.
Bun no solo es un runtime, sino también:
Bun puede instalar tus dependencias leyendo el package.json, ejecutar tus scripts y de una forma tan rápida como nunca antes se ha visto.
Bun toma un nuevo enfoque en muchos aspectos del ecosistema JavaScript centrándose en conseguir un buen rendimiento.
Prioriza Web APIs estándar como Fetch. Soporta muchas APIs de Node.js lo que lo hace compatible con la mayoría de paquetes NPM. Puede que por el momento no esté preparado para producción (debido a la falta de soporte en Windows) pero es una herramienta muy prometedora. Comparándolo con Deno, su ecosistema es muy reciente sin embargo ya tiene un web framework llamado Elysia que afirma ser el framework HTTP más rápido.
Una de las cosas más sorprendentes sobre Bun es que su creador Jarred Sumner implementó todas estas funcionalidades desde cero, usando un lenguaje de bajo nivel llamado Zig.
Echa un ojo a A Complete Overhaul of the JavaScript Ecosystem para conocer más detalles.
Tauri
Llegando a ocupar la quinta posición en el 2021, Tauri ha llegado a ser aún más popular este año, consiguiendo 30,000 nuevas estrellas. Es un proyecto escrito en Rust para crear aplicaciones de escritorio multi plataforma usando tecnologías web.
La versión 1.0 fue lanzada en junio.
Ha sido creado teniendo muy en cuenta la seguridad y el rendimiento. Comparado con Electron, este se centra en reducir la huella ecológica utilizando los menores recursos del sistema posibles, ofreciendo funcionalidades compiladas que no necesitan evaluación runtime y facilitando guías a los desarrolladores para optimizar al máximo sus apps.
React y Next.js
En tercer y cuarto puesto, React y Next.js tienen cifras similares, con casi 20,000 estrellas nuevas.
Next.js 13 apareció en octubre, proporcionando los React Server Components introducidos por React 17 en el 2020.
Andrew Clark, uno de los responsables del mantenimiento de React, hizo una declaración sobre su futura adopción en este hilo:
Vite
Ocupando la quinta posición, Vite es la herramienta más popular para crear aplicaciones basadas en tecnologías web, que a la vez proporciona una estupenda experiencia de desarrollo.
Ha tenido dos lanzamientos importantes este año (v3 en julio y v4 en diciembre).
Vite potencia cada vez más proyectos, incluyendo los frameworks SvelteKit, Qwik y Vitest.