High Performance Responsive Design

Libro breve de Tom Barker (O'Reilly, 2014) que sostiene que el diseño responsive no es solo una técnica del frontend con media queries, sino una forma de aprovechar todo el stack web para que los sitios carguen rápido en cualquier dispositivo. Está dirigido a desarrolladores web de nivel intermedio y avanzado, sobre todo del frontend, que ya hacen sitios responsive y conocen JavaScript y algo de backend.

Después de repasar el estado del diseño responsive y de explicar cómo funciona el rendimiento de una aplicación web (ciclo de petición y respuesta, renderizado, métricas de carga), el autor muestra cómo incluir el rendimiento en la planificación del proyecto mediante presupuestos de rendimiento y acuerdos de nivel de servicio (SLA). En el backend usa Node.js para detectar el dispositivo y servir solo lo que hace falta. En el frontend trata técnicas para no descargar recursos innecesarios en móviles, como imágenes adaptadas y carga condicional de scripts y estilos. También explica cómo automatizar las pruebas de rendimiento en integración continua con PhantomJS y compara varios frameworks responsive, entre ellos Ripple, el framework de servidor creado por el propio autor.

El índice se divide en siete capítulos: estado de la industria, rendimiento, planificación, backend, frontend, pruebas continuas de rendimiento y frameworks. La práctica son fragmentos de código y scripts de ejemplo, no un proyecto completo. Su aporte principal es la idea de diseñar con el servidor en mente (RESS) y medir el rendimiento de forma continua. Sin embargo, varias herramientas que usa, como PhantomJS, ya se abandonaron, y hoy las sustituyen Lighthouse, Puppeteer o Playwright, así como las imágenes responsive nativas con srcset y picture. Conviene leerlo por los conceptos y no por las herramientas.