Made by Dhawal Made by Dhawal

Frontend · Mumbai · Since 2005

I write about the frontend — and build the demo so you can break it.

Twenty years shipping the web. Every post ships with something you can drag, resize, or take apart.

A new piece every other Tuesday. No newsletter about the newsletter.

Your viewport — live —  ·  —

↔ Drag the window edge. That's the whole pitch.

Latest14 posts

Part 1.2: Image LCP: fetchpriority, Preload & Format Decisions

The highest-ROI line in image performance is one attribute most codebases still don't use: fetchpriority="high". Here's the image LCP fix list, ordered by actual impact — priority, preload, responsive sizing, and formats — and why teams work it in exactly the wrong order.

20 AUG 2026 · 7 MIN · PERFORMANCE

Part 1.1: The Four Phases of LCP: Where Your Time Actually Goes

Every slow LCP is slow in one of four places — and most teams expertly optimize the phase that was never the problem. One retail site had a backlog full of image-compression tickets when the real fix recovered 1.8 seconds and recompressed nothing. Here's how to read the four phases in five minutes.

08 AUG · 7 min

How to Optimize LCP for Images (Interactive Lab)

Image LCP comes down to two questions: how many bytes and how soon. Optimization answers the first; preload, fetchpriority, and eager loading answer the second; decoding and reserved dimensions keep the paint and the layout clean. Tune those on your real hero image in the lab above, ship the best-practice markup, and watch your Core Web Vitals move into the green.

29 JUL · 7 min

Part 1: What Is the LCP Element? How the Browser Picks It

You can't fix your Largest Contentful Paint until you know which element the browser actually picked — and it's often not the hero image you've been optimizing. Here's how the browser really chooses your LCP element, the surprising exclusions that trip teams up, and how to find yours in the field.

28 JUL · 7 min