<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"><channel><title>Joan León - English</title><description>Blog de desarrollo web: Web Performance, CSS, JavaScript, React, Web Animation, Media Optimization y Creative Coding.</description><link>https://joanleon.dev/</link><item><title>AI in Web Performance Audits: Deterministic Measurement and Actionable Reports</title><link>https://joanleon.dev/en/ai-web-performance-audits-scripts-reports/</link><guid isPermaLink="true">https://joanleon.dev/en/ai-web-performance-audits-scripts-reports/</guid><description>How to combine deterministic scripts and AI agents to go from metrics collection to an actionable report, and lay the foundations for continuous regression testing in performance.</description><pubDate>Thu, 26 Mar 2026 10:00:00 GMT</pubDate></item><item><title>AI-Driven Performance Debugging: Gemini + Chrome DevTools MCP</title><link>https://joanleon.dev/en/gemini-chrome-devtools-mcp-debugging/</link><guid isPermaLink="true">https://joanleon.dev/en/gemini-chrome-devtools-mcp-debugging/</guid><description>A hands-on workshop for performance debugging with Gemini CLI connected to the browser via Chrome DevTools MCP: from identifying a Long Task in minified code to having the agent create the branch and open the PR.</description><pubDate>Wed, 18 Mar 2026 10:00:00 GMT</pubDate></item><item><title>Adding an AI summary to blog posts with the Chrome Summarizer API</title><link>https://joanleon.dev/en/ai-summary-chrome-summarizer-api/</link><guid isPermaLink="true">https://joanleon.dev/en/ai-summary-chrome-summarizer-api/</guid><description>How to add an AI summary button to an Astro blog using the browser&apos;s native Chrome Summarizer API, without servers or external APIs.</description><pubDate>Fri, 13 Mar 2026 11:10:58 GMT</pubDate></item><item><title>WebPerf Snippets: progressive disclosure in Claude Skills</title><link>https://joanleon.dev/en/webperf-snippets-progressive-disclosure/</link><guid isPermaLink="true">https://joanleon.dev/en/webperf-snippets-progressive-disclosure/</guid><description>Applying Anthropic&apos;s progressive disclosure system (L1/L2/L3) to reduce the context loaded by WebPerf Snippets Skills and free space in the agent&apos;s context window.</description><pubDate>Tue, 10 Mar 2026 10:00:00 GMT</pubDate></item><item><title>WebPerf Snippets agent-first: structured returns and minimal tokens</title><link>https://joanleon.dev/en/webperf-snippets-agent-first/</link><guid isPermaLink="true">https://joanleon.dev/en/webperf-snippets-agent-first/</guid><description>WebPerf Snippets scripts now return structured JSON directly from evaluate_script() and are minified at build time with dead code elimination, significantly reducing token footprint.</description><pubDate>Sun, 08 Mar 2026 10:00:00 GMT</pubDate></item><item><title>WebPerf Snippets and Agent SKILLs: deterministic audits with Chrome DevTools MCP</title><link>https://joanleon.dev/en/webperf-snippets-agent-skills/</link><guid isPermaLink="true">https://joanleon.dev/en/webperf-snippets-agent-skills/</guid><description>WebPerf Snippets become Agent SKILLs with scripts as deterministic tools for AI agents, executable directly in the browser via Chrome DevTools MCP.</description><pubDate>Wed, 04 Mar 2026 10:00:00 GMT</pubDate></item><item><title>WebPerf Snippets + WebMCP: web metrics that AI understands</title><link>https://joanleon.dev/en/webperf-snippets-webmcp/</link><guid isPermaLink="true">https://joanleon.dev/en/webperf-snippets-webmcp/</guid><description>WebPerf Snippets exposes its performance measurement tools via WebMCP, the new protocol that lets AI assistants interact with the browser natively.</description><pubDate>Tue, 03 Mar 2026 10:00:00 GMT</pubDate></item><item><title>WebAssembly: the W3C&apos;s forgotten standard</title><link>https://joanleon.dev/en/webassembly/webassembly-w3c-standard/</link><guid isPermaLink="true">https://joanleon.dev/en/webassembly/webassembly-w3c-standard/</guid><description>WebAssembly has been a W3C standard since 2019, but many developers still don&apos;t know about it. What it really is, how it works, and why you should know about it.</description><pubDate>Sun, 01 Mar 2026 10:00:00 GMT</pubDate></item><item><title>SVGs on the web: performance comparison based on how you load them</title><link>https://joanleon.dev/en/svg-optimization/</link><guid isPermaLink="true">https://joanleon.dev/en/svg-optimization/</guid><description>Inline, sprite with &lt;use&gt;, &lt;object&gt;, &lt;img&gt;... each way of loading an SVG has different implications for performance, caching and rendering. A practical analysis to help you choose well.</description><pubDate>Tue, 24 Feb 2026 10:00:00 GMT</pubDate></item><item><title>Practical guide to the &lt;img&gt; element: from the basics to LCP</title><link>https://joanleon.dev/en/guia-practica-elemento-img/</link><guid isPermaLink="true">https://joanleon.dev/en/guia-practica-elemento-img/</guid><description>The &lt;img&gt; element has attributes that make a real difference in performance: loading, decoding, fetchpriority, srcset and sizes. A practical guide to using them well.</description><pubDate>Sun, 22 Feb 2026 10:00:00 GMT</pubDate></item><item><title>Yield to Main: setTimeout vs queueMicrotask vs scheduler.postTask</title><link>https://joanleon.dev/en/yield-to-main-optimize-inp/</link><guid isPermaLink="true">https://joanleon.dev/en/yield-to-main-optimize-inp/</guid><description>A practical guide on how to use setTimeout, queueMicrotask and scheduler.postTask to break up long tasks and optimize INP. Comparison with measurable examples.</description><pubDate>Wed, 18 Feb 2026 10:00:00 GMT</pubDate></item><item><title>Optimizing Consent Scripts for Core Web Vitals</title><link>https://joanleon.dev/en/consent-scripts-performance/</link><guid isPermaLink="true">https://joanleon.dev/en/consent-scripts-performance/</guid><description>Consent management scripts (CMP) compete with critical resources if not prioritized correctly. A server-side strategy to optimize loading based on visit type.</description><pubDate>Fri, 13 Feb 2026 10:00:00 GMT</pubDate></item><item><title>Chrome DevTools for Debugging Web Performance</title><link>https://joanleon.dev/en/chrome-devtools-debugging-2025/</link><guid isPermaLink="true">https://joanleon.dev/en/chrome-devtools-debugging-2025/</guid><description>This article is available in English on the original source at PerfPlanet Performance Calendar 2025.</description><pubDate>Fri, 02 Jan 2026 00:00:00 GMT</pubDate></item><item><title>Optimize rendering with content-visibility</title><link>https://joanleon.dev/en/content-visibility/</link><guid isPermaLink="true">https://joanleon.dev/en/content-visibility/</guid><description>The CSS property content-visibility improves rendering performance. Practical case with metrics and snippets to detect opportunities.</description><pubDate>Sat, 27 Dec 2025 00:00:00 GMT</pubDate></item><item><title>CSS Media Queries Analysis to Optimize Performance</title><link>https://joanleon.dev/en/css-media-queries-analysis/</link><guid isPermaLink="true">https://joanleon.dev/en/css-media-queries-analysis/</guid><description>Learn how to analyze CSS media queries to detect and optimize unused styles on mobile, improving your website&apos;s performance with a simple JavaScript snippet.</description><pubDate>Tue, 02 Dec 2025 00:00:00 GMT</pubDate></item><item><title>Talks 2023</title><link>https://joanleon.dev/en/talks-2023/</link><guid isPermaLink="true">https://joanleon.dev/en/talks-2023/</guid><description>A review of the talks I gave during 2023</description><pubDate>Sun, 31 Dec 2023 00:00:00 GMT</pubDate></item><item><title>Interpret Your Metrics Correctly</title><link>https://joanleon.dev/en/interpret-your-metrics-correctly/</link><guid isPermaLink="true">https://joanleon.dev/en/interpret-your-metrics-correctly/</guid><description>A metric number is just a number, until you know how to interpret it.</description><pubDate>Sat, 04 Mar 2023 00:00:00 GMT</pubDate></item><item><title>Analyzing User Flow Web Performance with Chrome DevTools</title><link>https://joanleon.dev/en/chrome-devtools-user-flow/</link><guid isPermaLink="true">https://joanleon.dev/en/chrome-devtools-user-flow/</guid><description>In Chrome 97 a new tool appears in DevTools to measure performance in the navigation and interaction experience of visitors to our website</description><pubDate>Mon, 08 Nov 2021 00:00:00 GMT</pubDate></item><item><title>My Opinion on Tailwind CSS</title><link>https://joanleon.dev/en/tailwindcss/</link><guid isPermaLink="true">https://joanleon.dev/en/tailwindcss/</guid><description>Utility-First CSS frameworks are gaining a lot of traction, especially Tailwind CSS. Is it a good option?</description><pubDate>Tue, 26 Jan 2021 00:00:00 GMT</pubDate></item><item><title>I Prefer PostCSS</title><link>https://joanleon.dev/en/postcss/</link><guid isPermaLink="true">https://joanleon.dev/en/postcss/</guid><description>Let me explain why I prefer PostCSS for writing CSS.</description><pubDate>Fri, 08 Jan 2021 00:00:00 GMT</pubDate></item><item><title>It&apos;s Curious How Forgotten and Mistreated CSS Is</title><link>https://joanleon.dev/en/css-mistreated/</link><guid isPermaLink="true">https://joanleon.dev/en/css-mistreated/</guid><description>At over 24 years old, CSS continues to be a despised language.</description><pubDate>Mon, 04 Jan 2021 00:00:00 GMT</pubDate></item><item><title>Detect AVIF Support for Your CSS Images</title><link>https://joanleon.dev/en/avif-css/</link><guid isPermaLink="true">https://joanleon.dev/en/avif-css/</guid><description>Implement the new AVIF image format in your CSS `background-image`.</description><pubDate>Sun, 06 Dec 2020 00:00:00 GMT</pubDate></item><item><title>CSS Books</title><link>https://joanleon.dev/en/css-books/</link><guid isPermaLink="true">https://joanleon.dev/en/css-books/</guid><description>A compilation of CSS books that can help you improve your knowledge in the art of styling your projects.</description><pubDate>Sat, 17 Oct 2020 00:00:00 GMT</pubDate></item><item><title>Learning to Program with Processing and P5js</title><link>https://joanleon.dev/en/learning-to-program/</link><guid isPermaLink="true">https://joanleon.dev/en/learning-to-program/</guid><description>There are many methodologies and languages for learning to program, which is why the first thing a person who wants to learn to program faces is choosing a language or development platform.</description><pubDate>Sat, 12 Sep 2020 00:00:00 GMT</pubDate></item><item><title>Agile Design with TDD</title><link>https://joanleon.dev/en/agile-design-with-tdd/</link><guid isPermaLink="true">https://joanleon.dev/en/agile-design-with-tdd/</guid><description>In this article I want to share my opinion of the book &apos;Agile Design with TDD&apos;, from which I&apos;ve been able to learn the foundations of TDD.</description><pubDate>Mon, 24 Aug 2020 00:00:00 GMT</pubDate></item><item><title>Clean JavaScript: Clean Code, SOLID and Testing</title><link>https://joanleon.dev/en/clean-javascript/</link><guid isPermaLink="true">https://joanleon.dev/en/clean-javascript/</guid><description>I want to recommend the book Clean JavaScript, by Miguel A. Gómez, where he teaches us to apply good practices, write robust and easy-to-maintain code. With the aim of developing good software with JavaScript.</description><pubDate>Wed, 19 Aug 2020 00:00:00 GMT</pubDate></item><item><title>CSS Animations</title><link>https://joanleon.dev/en/css-animations/</link><guid isPermaLink="true">https://joanleon.dev/en/css-animations/</guid><description>With CSS animations we have much more control than with transitions to create animations thanks to @keyframes.</description><pubDate>Sun, 12 Jul 2020 00:00:00 GMT</pubDate></item><item><title>CSS Transitions</title><link>https://joanleon.dev/en/css-transitions/</link><guid isPermaLink="true">https://joanleon.dev/en/css-transitions/</guid><description>CSS Transitions allow property value changes to occur progressively over a specified period of time.</description><pubDate>Sun, 23 Feb 2020 00:00:00 GMT</pubDate></item><item><title>AVIF, the Definitive Image Format?</title><link>https://joanleon.dev/en/avif-definitive-image-format/</link><guid isPermaLink="true">https://joanleon.dev/en/avif-definitive-image-format/</guid><description>AVIF is a next-generation image format that reduces JPEG images by up to ~50%.</description><pubDate>Mon, 10 Feb 2020 00:00:00 GMT</pubDate></item><item><title>Web Animation</title><link>https://joanleon.dev/en/web-animation/</link><guid isPermaLink="true">https://joanleon.dev/en/web-animation/</guid><description>We&apos;ve had animation on the web for a long time, let&apos;s take a look at the different ways to do web animation.</description><pubDate>Mon, 10 Feb 2020 00:00:00 GMT</pubDate></item><item><title>Finally Understanding JPG</title><link>https://joanleon.dev/en/finally-understanding-jpg/</link><guid isPermaLink="true">https://joanleon.dev/en/finally-understanding-jpg/</guid><description>This article is available in English on the original source by Christoph Erdmann.</description><pubDate>Tue, 04 Feb 2020 00:00:00 GMT</pubDate></item><item><title>CSS Pixel Art</title><link>https://joanleon.dev/en/css-pixel-art/</link><guid isPermaLink="true">https://joanleon.dev/en/css-pixel-art/</guid><description>Pixel Art is a design technique that continues to be used as a resource in many video games. With CSS we can use this technique in a very simple way.</description><pubDate>Sun, 12 Jan 2020 00:00:00 GMT</pubDate></item><item><title>CSS Houdini, More Than Magic</title><link>https://joanleon.dev/en/css-houdini-more-than-magic/</link><guid isPermaLink="true">https://joanleon.dev/en/css-houdini-more-than-magic/</guid><description>For many people CSS is a magician&apos;s thing, some might even believe it&apos;s witchcraft, but that&apos;s because they don&apos;t know the necessary spells to have real control over CSS.</description><pubDate>Sat, 04 Jan 2020 00:00:00 GMT</pubDate></item><item><title>Motion Craftsmanship</title><link>https://joanleon.dev/en/motion-craftsmanship/</link><guid isPermaLink="true">https://joanleon.dev/en/motion-craftsmanship/</guid><description>Little needs to be said about the importance of animation in websites and applications, designers and developers are aware of it, just by opening the browser or applications we can appreciate it. But let&apos;s see what&apos;s hidden under the definition of Motion Craftsmanship.</description><pubDate>Sat, 04 Jan 2020 00:00:00 GMT</pubDate></item><item><title>Where to Start Optimizing My Images</title><link>https://joanleon.dev/en/where-to-start-optimizing-images/</link><guid isPermaLink="true">https://joanleon.dev/en/where-to-start-optimizing-images/</guid><description>As web development professionals, we worry about choosing the best framework, the most current library, applying best practices in JavaScript and CSS, being careful with HTML semantics to improve SEO, improving our content&apos;s accessibility, bundling and splitting files to optimize loading, but what about images?</description><pubDate>Sat, 04 Jan 2020 00:00:00 GMT</pubDate></item></channel></rss>