La misión de Replit es hacer que la programación sea más accesible. Brindamos a las personas computación en la nube gratuita para que puedan crear aplicaciones en cualquier dispositivo. Una de las formas más populares de crear aplicaciones en Internet hoy en día es React. Sin embargo, históricamente las herramientas React han sido lentas en Replit. Si bien el ecosistema de JavaScript ha creado excelentes herramientas para desarrolladores profesionales, muchas de las más populares, como Create React App y Webpack, se están volviendo más complejas e ineficientes.
Afortunadamente, hemos visto a la comunidad de JavaScript comprender este desafío y avanzar hacia la creación de herramientas más rápidas y eficientes, lo que significa que finalmente podemos brindar la experiencia que nuestros usuarios esperan de nosotros.
Esta nueva experiencia se basa en Vite , una herramienta de creación de JavaScript que permite un desarrollo rápido y rentable. Vite viene con una serie de características que incluyen HMR o Reemplazo de módulo en caliente, un comando de compilación que integra sus herramientas con Rollup y compatibilidad incorporada con TypeScript y JSX.
Vite acelera el desarrollo con React. Acelera mucho. Con HMR, los cambios que realiza se representan en milisegundos, lo que acelera drásticamente la creación de prototipos de IU. Con eso en mente, decidimos reescribir nuestra plantilla React usando Vite y nos sorprendió ver cuánto más rápido se volvió. Así es como se ve en comparación con nuestra antigua plantilla CRA:
Durante las últimas semanas, nuestra nueva plantilla React ha ayudado a nuestros diseñadores a crear prototipos de componentes de IU complejos y ha permitido a muchos de nuestros candidatos a ingenieros crear una aplicación web completa en tan solo unas horas en nuestros sitios (virtuales). Cuando ve esto en acción, es fácil ver por qué:
Cómo funciona
Vite funciona tratando su código fuente y sus dependencias de manera diferente. A diferencia de su código fuente, las dependencias no cambian con tanta frecuencia durante el desarrollo. Vite aprovecha este hecho al empaquetar previamente sus dependencias con esbuild . Esbuild es un constructor de JS escrito en Go que agrupa las dependencias de 10 a 100 veces más rápido que las alternativas basadas en JavaScript como Webpack y Parcel.
Luego entrega su código fuente a través de módulos nativos ES o ESM, lo que permite que el navegador maneje el paquete real.
Finalmente, Vite es compatible con HMR, lo que garantiza que cuando edita un archivo, solo se reemplazan los módulos relevantes, en lugar de reconstruir el paquete completo, lo que provoca una recarga de la página y restablece el estado. A diferencia de otros constructores, Vite hace HMR en sus propios módulos ES, lo que significa que solo necesita invalidar los módulos afectados al editar el archivo. Esto asegura que los tiempos de actualización sean consistentemente rápidos y no escalen linealmente a medida que su aplicación crece.
Empecemos
Para comenzar, simplemente bifurque nuestra plantilla React o seleccione React.js en el menú desplegable cuando cree una nueva repetición .
Vite también es independiente del marco, por lo que si no le gusta React, también puede usar nuestras plantillas Vue y Vanilla JS .
Esperamos que esto le ayude a dar vida a sus ideas aún más rápido, y esperamos ver lo que crea.