Improve LCP, CLS and interaction quality from the markup itself with smarter loading and layout decisions.
Think in terms of causes and effects, not isolated tricks.
Prioritize the main resource with `preload` or `fetchpriority`.
Set `width` and `height` to avoid layout jumps.
Reduce early blocking work with deferred scripts and calmer startup.
Not everything deserves the same urgency.
Browsers need clues to decide what should download first. If the first screen depends on a large hero image or a specific font, tell the browser clearly.
Do not overuse `preload`. It should be reserved for assets that truly matter to the initial render.
Users hate clicking targets that move at the last moment.
Many layout shifts come from images without dimensions, embeds injected late or dynamic blocks with no reserved space.
The fix is often simple: define dimensions and stable containers from the HTML before the browser paints the page.