Frontend en 2021
Tienes dudas sobre por dónde tirar este año?, ¿tienes la sensación de que cada día sale una nueva librería o herramienta que aprender pero no te da la vida?, take easy, vamos a intentar repasar las partes que desde mi punto de vista son más interesantes este año y que personalmente tendré en cuenta para aprender, apoyándonos en los resultados obtenidos en la encuesta anual de StateofJs.
ECMAscript 2021
Para que este artículo no fuese tan grande, separé las funcionalidades que considero más importantes de ECMA en este 2021 en otro artículo, puedes leerlo aquí.
Aplicaciones NoCode
Están apareciendo herramientas que te pueden ayudar a crear productos sin necesidad de saber programar. Las más famosas pueden ser:
- Airtable
- Bubble
- Leadpages
- Google Tables
- Notion: para mí la más interesante del momento hasta que salga Google Tables (tendremos que verlo). Además, este año van a lanzar una funcionalidad que ya está en Beta para consumir tu Notion mediante una API.
Personalmente uso Notion como gestor documental, organizador y donde tomar notas, mientras que Leadpages y Bubble las he usado para desarrollar MVP.
Creo que este tipos de herramientas serán cada vez más utilizadas ya que ahorra tiempo de desarrollo y son muy interesantes para la validación de hipótesis mediante MPVs.
También debemos tener en cuenta las herramientas de Automatización como Integromat, Zapier o n8n. Estas pueden empezar a aparecer en las organizaciones para ahorrar costes en tiempo y errores en tareas repetitivas, te dejo un artículo de un crack donde te introduce un poco en estas herramientas y en el concepto.
Server Side Rendering
Hay una clara tendencia en el uso de frameworks SSR para el desarrollo de aplicaciones que quieren tener mejor posicionamiento SEO. Aunque en principio el robot de Google también analiza las aplicaciones SPA, puede que no tenga el tiempo suficiente para analizar todas las páginas de este tipo de aplicaciones, viéndose así beneficiadas las aplicaciones SSR ya que al devolver directamente HTML al navegador el análisis del robot será más rápido y dará lugar a analizar más contenido de la misma.
Desde mi punto de vista tenemos dos competidores claros:
- NuxtJS: Framework de Vue para aplicaciones SSR.
- NextJS: Framework de React para aplicaciones SSR. Actualmente estoy aprendiendo este Framework y de momento me está encantando, super recomendado.
Como mención especial, cabe destacar la nueva funcionalidad anunciada a finales de 2020 por el equipo de React: React Server Components. Aún es experimental y puede que el RFC publicado sufra cambios, pero básicamente consistirá en renderizar componentes desde el lado del servidor, aligerando así el bundle de nuestra aplicación y pudiendo mejorar la velocidad en peticiones al Backend que se realicen desde los propios Components.
Frameworks
¡Aquí es donde está la miga! Según la encuesta de StateofJs, el ganador de 2020 ha sido: Svelte.
Svelte es un framework como React o Vue, pero con la diferencia de que se ejecuta en el momento de la compilación, convirtiendo los componentes en un código más eficiente que actualiza el DOM de forma muy concisa, obteniendo buena performance en sus aplicaciones. Además, la sintaxis de este framework hace que podamos hacer más con menos código.
He de reconocer que ha sido una sorpresa que Svelte se coloque en la primera posición (yo lo conocía de oidas poco antes de hacer la encuesta), pero el resto de la clasificación era previsible, a excepción de nuevas apariciones como Alpine.js o Stimulus.
React y Vue siguen siendo los más usados y con mejor opinión, mientras que la satisfacción de Angular se ha ido a pique aunque su uso es muy parecido al de Vue, aunque personalmente creo que se debe al mantenimiento de proyectos legacy.
Mi pronostico para 2021 es que Vue se separará de Angular, Angular bajará y se le acercará Svelte, mientras que React seguirá con el trono e incluso se separará más del resto con la ayuda de NextJS, ¿acertaré la quiniela?.
Testing
Al igual que en el listado de frameworks, aquí también está ordenado por satisfacción. La tendencia de Jest sigue intacta, es uno de las mejores librerías para nuestros proyectos Front junto con Cypress (personalmente uso esta combinación), pero este año aparece un nuevo competidor que se queda con el primer puesto: Testing Library.
Testing Library es una librería que proporciona una lista de utilidades de forma muy simple y completa con distintos paquetes extras dependiendo del framework con el que estás desarrollando tu Frontend (aquí el listado). Sin duda tendremos que testearla un poco (Badum tss).
Empaquetadores
¿Quién no ha perdido un día configurando el fichero de webpack? Pues aparecen algunas librerías dispuestas a destronarlo o al menos cambiará la concepción del mismo:
Esbuild es un empaquetador de aplicaciones web escrito en Go, llegando a ser hasta 100 veces más rápido que los empaquetadores actuales:
Como principales características: muy buena velocidad sin necesidad de caché, tree-shaking, una API para JavaScript y Go, soporte para TypeScript y JSX, source maps, entre otros, y todo sin tener que configurar nada, ¿verdad que tiene buen pinta?
Aunque en la encuesta no aparece, para lo desarrolladores Vue seguramente les suene el nuevo empaquetador vite desarrollado por Evan You. Este empaquetador optimizado para Vue utiliza por debajo esbuild.
Como vemos, además del uso propio que le podemos dar con esbuild a nuestros proyectos, otros empaquetadores están también a su vez utilizándolo, tendremos que tenerlo en cuenta para este año.
Otros
No podemos terminar de dar un resumen de lo que creo que más veremos este 2021 sin mencionar los siguientes puntos:
TypeScript
Este superset de JavaScript vuelve a salir este año en el StateofJs como una de las tecnologías más adoptadas y utilizadas por la comunidad. No hay que hacer mucha presentación a TypeScript, simplemente mencionar que cada vez más frameworks y librerías están añadiendo soporte para poder usarlo o directamente están siendo desarrolladas sobre el, como es el caso de Vue 3, el cual está escrito en TypeScript, añadiendo un soporte nativo al framework.
Sin duda hay que añadirlo más en nuestros proyectos sobretodo si se trata de proyectos grandes o nos gusta el concepto de tipado más visible en el Back.
Tailwindcss
El framework CSS del momento. Una gran herramienta para maquetar rápidamente aplicaciones, de hecho tiene una gran lista de componentes de ejemplos aunque algunos son de pago. El problema de este tipo de librerías es que dejas de aprender CSS para aprender Utility-classes de la propia librería, por lo que tendrás algunos problemas si cambias de proyecto y en este no se usa. Otro punto en contra es que el HTML se hace más difícil de mantener.
Muy recomendable para desarrollos rápidos de MVP.
Trabajo en Remoto
El teletrabajo ha llegado para quedarse. Algunas empresas estaban ya experimentando esta modalidad antes de la pandemia, pero con esta hemos tenido que adaptarnos y aprender a teletrabajar. Cada vez más (me incluyo) necesitamos tener esa libertad de movimiento y tiempo que nos proporciona el teletrabajo. Está claro que se echa de menos a compañeros, echar esas cañas y tomar esos cafés mientras comentas el problema técnico con el que te estás peleando pero con una buena disciplina y cultura del teletrabajo, este te da: ahorro de tiempo en transporte, comes mejor (pa’ fuera los tuppers), vivir más barato alejándote de la ciudad y ayudando a la repoblación de zonas rurales e incluso menos interrupciones y distracciones.
Para mí, el objetivo sería que el ir a la oficina fuese opcional. Que si quieres ir vas, pero si no te apetece o vives en una ciudad distinta a donde se encuentra la oficina pues no, ¿tu que piensas?
¡Gracias por leerme! Espero que te haya servido al menos para conocer las tendencias actuales con mi humilde opinión. Si quieres, puedes dejarme en comentarios que piensas sobre las nuevas tendencias o sobre el teletrabajo.
¡A por el 2021 Frontenders!
