React ha sido una potencia para construir aplicaciones web en los últimos diez años.
Todos hemos visto cómo ha evolucionado desde esos torpes componentes de clase hasta la elegancia de los hooks.
Pero ¿Componentes de Servidor de React (RSCs)?
No creemos que nadie esperara un cambio tan drástico en cómo funciona React.
Entonces, ¿qué son exactamente los Componentes de Servidor de React? ¿Cómo funcionan? ¿Y qué hacen de manera diferente que React ya no podía hacer?
Para responder a todas estas preguntas, repasaremos rápidamente los fundamentos. Si necesitas un repaso, echa un vistazo rápido a esta guía sobre cómo aprender React como principiante.
En esta publicación, te guiaremos sobre por qué necesitábamos Componentes de Servidor de React, cómo funcionan y algunos de los principales beneficios de los RSCs.
¡Empecemos!
¿Qué son los Componentes de Servidor de React?
Imagina los Componentes de Servidor de React como una nueva forma de construir aplicaciones de React. En lugar de ejecutarse en el navegador como los componentes de React típicos, los RSCs se ejecutan directamente en tu servidor.
“Creo que los RSCs están diseñados para ser la “componentización” del backend, es decir, el equivalente en el backend de lo que hizo SPA React en el frontend. En teoría, podrían eliminar en gran medida la necesidad de cosas como REST y GraphQL, lo que llevaría a una integración mucho más estrecha entre el servidor y el cliente, ya que un componente podría atravesar toda la pila.” — ExternalBison54 en Reddit
Dado que los RSCs se ejecutan directamente en el servidor, pueden acceder eficientemente a recursos del backend como bases de datos y APIs sin necesidad de una capa adicional de obtención de datos.
API
Una Interfaz de Programación de Aplicaciones (API) es un conjunto de funciones que permiten a las aplicaciones acceder a datos e interactuar con componentes externos, sirviendo como un mensajero entre el cliente y el servidor.
Leer más
Pero, ¿por qué necesitábamos RSCs de todos modos?
Para responder a esta pregunta, retrocedamos un poco.
React Tradicional: Renderizado del Lado del Cliente (CSR)
React siempre ha sido una biblioteca de interfaz de usuario del lado del cliente.
La idea principal detrás de React es dividir todo tu diseño en unidades más pequeñas e independientes que llamamos componentes. Estos componentes pueden gestionar sus propios datos privados (estado) y pasar datos entre ellos (props).
Imagina estos componentes como funciones de JavaScript que se descargan y se ejecutan directamente en el navegador del usuario. Cuando alguien visita tu aplicación, su navegador descarga todo el código del componente, y React entra en acción para renderizar todo:
¿Por qué son importantes los React Server Components? Descubre cómo los RSCs pueden mejorar la eficiencia de acceso a recursos backend y la integración entre servidor y cliente.
