Nota del editor: el siguiente contenido fue publicado originalmente en el blog de Reddit por u/arbeitrary, Ingeniero de software sénior. Lea lo siguiente para conocer cómo Reddit está utilizando React para habilitar AMP.

En Reddit, recientemente creamos versiones alternativas de algunas páginas de comentarios que utilizan tecnología Accelerated Mobile Pages (AMP), una tecnología diseñada por Google y otras empresas en el mundo del código abierto para asegurar que las páginas se carguen instantáneamente a partir de resultados de búsqueda en los dispositivos móviles. Las implementamos para mejorar la experiencia en Reddit para los usuarios móviles.

Las creamos como una app Node.js que utiliza React y Redux. React es un marco de trabajo web que resuelve diversos problemas que se producen durante el desarrollo web. Redux es una biblioteca que ayuda a mantener el estado de las aplicaciones de la IU y abstrae las transiciones de estado fuera del control de los usuario y los callbacks de las API. De esta forma, ofrece una única e inmutable fuente de veracidad sobre el estado de las aplicaciones a los componentes de vista. Puede que React y Redux parezcan una opción extraña para una app que esencialmente provee lenguaje de marcado estático, pero descubrimos que la combinación es efectiva. Nuestra decisión se relacionó más con las personas y la productividad que con el código en sí.

Tenemos un increíble equipo que está trabajando duro en una nueva versión de nuestra aplicación web móvil que utiliza React y Redux. Reemplazará el sitio que actualmente se ejecuta en m.reddit.com, y estará lista en las próximas semanas. La nueva app es una app de una sola página, lo que significa que en lugar de que el servidor envíe cada página, el código JavaScript del lado del cliente gestiona los clics, realiza las solicitudes de datos a la API y envía las nuevas vistas al navegador. Para favorecer una gran experiencia al inicio cuando se carga la app, también admitimos el envío total y parcial de una página del lado del servidor.

Nuestro objetivo principal en cuanto a la tecnología elegida para crear la app AMP era que nos permitiera movernos rápido y al mismo tiempo crear una gran experiencia del usuario. Como AMP es una experiencia fundamentalmente móvil, optamos por usar como punto de partida la nueva versión de nuestra aplicación web móvil basada en React y Redux, pero usándola exclusivamente con envío del lado del servidor. Comencemos con un código base existente y concentrémonos en cómo se puede diferenciar una experiencia AMP para Reddit de la experiencia web móvil principal. React nos permite usar componentes AMP como amp-img o amp-accordion para crear nuestras vistas del mismo modo que usamos cualquier elemento HTML. Por ello, mantuvimos un paradigma uniforme con nuestros otros proyectos de React sin agregar ninguna adhesión para cada nuevo componente.

A medida que el tráfico AMP se incrementa, obtenemos más información sobre AMP en producción, y continuamos explorando nuevas formas de ofrecer servicios a los editores de Reddit, la línea entre la aplicación AMP y la aplicación web móvil se puede desdibujar. Dejamos la puerta abierta intencionalmente para fusionar la app AMP y la aplicación web móvil. En un nivel básico, esto hace que compartir los códigos sea más fácil y nos da flexibilidad para crear sobre AMP de carga rápida y enriquecer fácilmente la interactividad de las páginas a medida que nuevos usuarios se convierten en editores regulares de Reddit.

Desde la perspectiva de la experiencia del usuario y la tecnología, estamos muy contentos con las nuevas herramientas y los nuevos ecosistemas, como AMP y React. Ambos permiten a los programadores escribir mejores códigos para lograr una web rápida y atractiva. Todo vale cuando nos ayuda a crear tecnología sólida para ayudar a los editores de Reddit a encontrar su hogar en Internet.

Publicado por u/arbeitrary.