Debugging bfcache, make your page load instantly #DevToolsTips

11 552
10.8
Следующее
147 дней – 53 6255:05
What’s new in DevTools: Chrome 119-120
Популярные
141 день – 3 3180:58
Introducing CSS Wrapped
Опубликовано 1 декабря 2023, 0:00
Join Jecelyn and special guest Barry as they dive deep into the world of the bfcache and how it can make it lightning-fast to navigate around web sites. Learn how to optimize your site for the bfcache, and discover powerful debugging techniques to troubleshoot any blocking issues. Make sure your users are benefiting from this free web performance boost!

Chapters:
0:00 Intro
0:14 What is bfcache
1:00 When is bfcache in used
1:18 Test bfcache with DevTools
2:28 Tip: Test with Incognito mode
2:47 Test bfcahce with Lighthouse
3:03 Collect blocking reasons with notRestoredReasons API
3:15 Replace cache-control: no-store - Common blocking reason
3:53 Stop using unload handlers - Common blocking reason
4:37 Tip: Test with override permissions-policy headers
5:05 Ending

Resources:
Back/forward cache → goo.gle/49XnGNM
Test back/forward cache → goo.gle/3GmLCML
notRestoredReasons API → goo.gle/bfcache-notrestoredrea...
Case study → web.dev/case-studies/yahoo-jap...

Questions? Tweet to us:
Jecelyn Yeen → goo.gle/jecfish
Barry Pollard → goo.gle/tunetheweb
Chrome DevTools → goo.gle/chromedevtools

Catch more DevTools Tips → goo.gle/DevToolsTips
Subscribe to Chrome for Developers → goo.gle/ChromeDevs

#DevToolsTips #WebPerformance #Cache
автотехномузыкадетское