Blog
Mert Özen's blog posts on software development, backend, frontend, and DevOps.
Optimizing LCP: Reducing TTFB, Resource Load Delay, Load Duration and Render Delay One by One
To lower LCP, split it into TTFB, resource load delay, load duration and render delay and look at each one; if the image cannot be discovered in the HTML, fetchpriority alone does not help. On Bookstore's home page we measure that NgOptimizedImage priority gains nothing with client-side rendering while prerendering cuts load delay from 1.1 s to 27 ms, and we show the SSR pitfalls (document, transfer cache, UseDefaultFiles).
Angular SSR, Hydration and Performance: Prerendering, Incremental Hydration, Event Replay and the TTFB Cost
SSR and prerendering put the LCP content into the HTML and lower FCP and LCP compared with CSR, but because SSR renders on every request it adds a slow backend to TTFB; the fix is a short Output Cache. On Bookstore's book page FCP went from 1.28 s to 0.3 s; we also measured a block hydrating late with hydrate on viewport missing the transfer cache, repeating its request and breaking event replay.