🧒 Explain like I'm 5
Imagine your browser is a painter trying to paint a wall. A render-blocking resource is like a delivery that the painter refuses to start without — even if the delivery has nothing to do with painting the first section of the wall. CSS and JS files loaded in the `<head>` are like mandatory deliveries. Using `defer` is like telling the painter 'you can start while the delivery is on its way — just don't use it until it arrives.' Using `async` is even more relaxed: 'use it the second it arrives, even if you're mid-stroke'.
Interactive quiz
Check your understanding with an instant-feedback quick check.
Detailed notes
Senior-level deep dive: internals, pitfalls, and a self-interview ladder.
Practice with AI feedback
Answer out loud, get scored on correctness, depth, and clarity.