Blog
Mert Özen'in yazılım geliştirme, backend, frontend ve DevOps üzerine blog yazıları.
Angular SSR, Hydration ve Performans: Prerender, Incremental Hydration, Event Replay ve TTFB Bedeli
SSR ve prerender, LCP içeriğini HTML'e koyarak CSR'a göre FCP'yi ve LCP'yi düşürür, ama SSR her istekte render ettiği için backend'in yavaşlığını TTFB'ye ekler; çözüm kısa süreli Output Cache. Bookstore'un kitap sayfasında FCP 1,28 sn'den 0,3 sn'ye indi; hydrate on viewport ile geç hydrate olan bir bloğun transfer cache'i kaçırıp isteği tekrarladığını ve bunun event replay'i bozduğunu da ölçtük.
LCP'yi Optimize Etmek: TTFB, Resource Load Delay, Load Duration ve Render Delay'i Tek Tek Düşürmek
LCP'yi düşürmek için onu TTFB, resource load delay, load duration ve render delay olarak dört parçaya ayırıp her birine ayrı bakmak gerekir; görsel HTML'de keşfedilebilir değilse fetchpriority tek başına işe yaramaz. Bookstore ana sayfasında NgOptimizedImage priority'nin client-side render'da hiçbir şey kazandırmadığını, prerender'ın load delay'i 1,1 sn'den 27 ms'ye indirdiğini ölçüyor; SSR tuzaklarını (document, transfer cache, UseDefaultFiles) gösteriyoruz.