Hace unos meses escribí sobre cómo mejoré la métrica LCP usando WebP en xstoregames.com creando una Serverless Function en Vercel. Actualmente, estoy trabajando en la tienda de PlayStation usando Deno y 🍋 Fresh y quería mantener esta optimización para las imágenes. El principal problema que encontré fue que sharp no…

En 2021 tuve la posibilidad de dictar un taller sobre ⚡️Web Performance (junto a @lele_lester) y está disponible totalmente GRATIS. El objetivo fue compartir los conceptos, técnicas, métricas y herramientas que ayudan a llevar la web al siguiente nivel respecto a performance. Se profundizan en los detalles de la red…

La carta perdida “Thoughts on Flash” es una carta abierta de Steve Jobs donde explica las razones por las que Apple no iba a adoptar Flash pero ya no está disponible. Esta carta es parte de la historia de la web y considero que es importante que se mantenga accesible. Pude encontrarla y…

Mi deseo es que las aplicaciones web (Web Apps, PWAs) puedan hacer lo mismo que las aplicaciones nativas (Native Apps) en iOS, Android o Desktop. No estoy a favor de la discusión Web vs Native sino todo lo contrario, apuesto al trabajo conjunto o libre elección de las tecnologías en…

El resultado sigue confirmando que me copa Deno porque tiene foco en ser compatible con la plataforma web, funciona como el navegador. — El otro día estaba leyendo un post de Microsoft donde comentan que usan imágenes en base64 de menor calidad para acelerar la carga de LCP y luego cargan una de mayor calidad. Esto me hizo pensar en cómo lo podría hacer en Deno. El resultado sigue confirmando que me copa…

*El post fue actualizado en base a un comentario de javiperezrequejo.* Mejorando el LCP usando WebP En los ratos libres vengo trabajando en optimizar la performance de XStore, el side project para explorar el catálogo de juegos de Xbox. Actualmente está construido con una arquitectura 100% client-side y sin usar ningún framework, es todo vanilla…

Preact Signals viene a llenar el espacio vacío entre las islas 🏝. — 🏝 Islands Architecture es la arquitectura que mejor se adapta a como pienso el frontend. Sin embargo, tiene una desventaja cuando necesitamos manejar un estado global y comunicar cambios entre las islas. ¡Hasta hoy! Preact Signals ofrece una nueva primitiva para manejar estados (globales o locales) y poder compartirlo entre…

Un skill importante que se necesita en frontend es diferenciar componentes server-side y client-side. — React Server Components, Component Islands, Web Components es lo que se viene y hay que ir poniendo en practica este skill para sacarles el mayor provecho. Los Server Components se renderizan únicamente en el servidor y siempre son estáticos. …

Los template literals o template strings fueron un antes y después a la hora de manejar strings en JavaScript. En lo personal los uso mucho para crear “componentes de HTML” y poder reutilizar el markup cuando no uso frameworks o librerías. Lo que no sabía es que se pueden crear…