Panduan Back/Forward Cache (bfcache)
Apa back/forward cache adalah — browser fitur itu freezes sebuah seluruh halaman di memory untuk instant Back/Forward navigation — bagaimana ini differs dari HTTP cache, apa blocks eligibility, cara test ini, dan -nya nyata (indirect) hubungan untuk Core Web Vitals dan SEO.
Bahasa
back/forward cache (bfcache) adalah sebuah browser optimization itu freezes sebuah seluruh halaman — DOM, JavaScript heap, berjalan state — di memory ketika Anda navigate away, so pressing Back atau Forward dapat restore ini instantly dengan Tidak reload, Tidak re-render, dan Tidak network permintaan, sebagai panjang sebagai browser hasn't evicted itu frozen snapshot pertama. ini adalah sebuah browser fitur, tidak sebuah penelusuran peringkat factor: Google's own Core Web Vitals peringkat docs tidak pernah mention ini. -nya SEO relevance adalah indirect dan scoped — sebuah bfcache-restored navigation posts near-instant LCP dan effectively zero CLS untuk pengguna siapa mendapatkan satu, yang dapat meningkatkan Anda aggregate field Core Web Vitals pada apa pun situs dengan bermakna Back/Forward traffic (1 di 10 desktop dan 1 di 5 mobile navigations), tetapi ini tidak jaminan Anda restore rate, Anda overall CWV rating, rankings, atau conversion. single biggest blocker adalah unload event handler; secara historis largest adalah Cache-Control: Tidak-store, though Chrome now memungkinkan bfcache untuk banyak Tidak-store halaman conditionally sebagai dari -nya 2025 rollout. Test dengan Chrome DevTools untuk satu kali lab memeriksa, atau Chrome-hanya notRestoredReasons API untuk data lapangan. jangan confuse bfcache dengan HTTP cache, browser's di-memory resource cache, sebuah service worker's Cache Storage, atau old retired 'cached halaman' penelusuran fitur.
Evidence for this claim The back-forward cache stores a complete page snapshot for instant history navigation. Scope: Current official or standards documentation. Confidence: high · Verified: web.dev: Back/forward cache Evidence for this claim Browser eligibility rules and APIs such as unload handlers can prevent bfcache use. Scope: Current official or standards documentation. Confidence: high · Verified: web.dev: bfcache eligibilityTL;DR — back/forward cache (bfcache) adalah sebuah browser fitur itu freezes sebuah seluruh halaman di memory ketika Anda leave ini, so pressing Back atau Forward dapat bring ini back instantly — Tidak reload — sebagai panjang sebagai browser hasn’t evicted itu frozen halaman pertama. ini adalah sebuah browser hal, tidak sebuah Google peringkat factor. tetapi karena sebuah restored halaman memuat near-instantly, ini diam-diam improves Anda Core Web Vitals angka pada Back/Forward navigations itu melakukan mendapatkan restored, yang adalah mengapa sebuah performa audit mungkin tell Anda untuk “fix bfcache eligibility.” (terjemahan) “perbaiki kelayakan bfcache.”
Apa bfcache adalah
Ketika Anda click browser’s Back button, satu dari dua hal happens. Either browser rebuilds sebelumnya halaman dari scratch — re-downloading files, re-berjalan JavaScript, re-laying-out seluruh hal — atau ini restores halaman instantly, persis sebagai Anda left ini. itu instant versi adalah back/forward cache, atau bfcache.
Di sini’s trick: alih-alih throwing old halaman away ketika Anda navigate off ini, browser freezes entire halaman di memory — semuanya, including berjalan JavaScript — dan mempertahankan ini pada ice. jika Anda come back soon dan browser masih memiliki itu frozen halaman tersedia, ini un-freezes dan menampilkan Anda tepat halaman again — Tidak network permintaan, Tidak menunggu. ini adalah sebuah mungkin restore, tidak sebuah jaminan: browser dapat evict sebuah frozen halaman dari memory sebelum Anda hit Back (rendah memory, sebuah timeout, certain activity), di yang case Anda hanya mendapatkan sebuah wajar reload alih-alih.
Google’s own satu-line deskripsi says ini plainly: bfcache adalah “a browser optimization that enables instant back and forward navigation.” (terjemahan) “pengoptimalan browser yang memungkinkan navigasi maju dan mundur secara instan.”*
Mengapa bfcache bukan cache yang sudah Anda kenal
ini adalah bagian orang mix up. Ketika Anda hear “cache” (terjemahan) “cache” Anda probably think dari browser cache atau HTTP cache — files (images, scripts, stylesheets) Anda browser saves so ini tidak re-download them. Bfcache adalah tidak itu. itu caches store files; bfcache stores seluruh living halaman, JavaScript state dan semua, sebagai sebuah snapshot. Chrome’s own documentation spells ini out: bfcache “differs from browser cache and HTTP cache.” (terjemahan) “berbeda dari cache browser dan cache HTTP.”*
ini adalah juga tidak dua lainnya hal orang sometimes lump di dengan ini: browser’s
di-memory resource cache (compiled scripts dan decoded images ini mempertahankan sekitar
untuk Anda saat ini session) dan sebuah service worker’s Cache Storage (permintaan/respons
pairs sebuah situs explicitly manages dengan caches.open()). Keduanya dari itu dapat menjadi active
pada yang sama halaman sebagai bfcache — mereka’re hanya terpisah mechanisms, tidak bfcache itself.
ini adalah juga tidak old “cached halaman” (terjemahan) “cached halaman” atau “cached snapshot” (terjemahan) “cached snapshot” fitur itu Google dan Bing digunakan untuk offer di hasil pencarian ( little dropdown itu showed Anda versi dari sebuah halaman mereka memiliki pada file). itu adalah sebuah penelusuran fitur dan ini adalah telah retired. Bfcache adalah sebuah langsung browser fitur dengan tidak ada apa pun untuk melakukan dengan hasil pencarian.
melakukan bfcache help my SEO?
Tidak secara langsung. Bfcache adalah tidak sebuah Google peringkat factor — Google’s own Core Web Vitals peringkat documentation tidak pernah mentions ini. Apa ini melakukan adalah membuat Anda Back/Forward navigations muat near-instantly untuk pengunjung siapa sebenarnya mendapatkan sebuah restore, dan browser mengukur itu sebagai sebuah excellent “halaman load.” (terjemahan) “pemuatan halaman.” So jika sebuah lot dari Anda pengunjung hit Back dan Forward (shopping, browsing hasil pencarian, reading artikel untuk artikel), bfcache dapat meningkatkan Anda situs’s overall Core Web Vitals field angka — yang adalah satu dari banyak hal Google says lines up dengan apa -nya peringkat sistem reward. Dua langkah dihapus dari “bfcache boosts rankings,” (terjemahan) “bfcache boosts rankings,” dan ini tidak jaminan Anda restore rate, Anda overall Core Web Vitals rating, atau Anda rankings — tetapi ini adalah nyata, dan ini adalah measurable.
ingin penuh picture — persis apa blocks bfcache, cara test ini, dan precise (tidak oversold) Core Web Vitals connection? Switch untuk Advanced tab.
Evidence for this claim The back-forward cache stores a complete page snapshot for instant history navigation. Scope: Current official or standards documentation. Confidence: high · Verified: web.dev: Back/forward cache Evidence for this claim Browser eligibility rules and APIs such as unload handlers can prevent bfcache use. Scope: Current official or standards documentation. Confidence: high · Verified: web.dev: bfcache eligibilityTL;DR — Bfcache adalah snapshot seluruh halaman di memori (DOM + heap JS + state yang berjalan), bukan respons HTTP yang dapat diambil ulang, cache resource dalam memori browser, atau Cache Storage milik service worker — inilah perbedaan konseptual utama. Saat bernavigasi keluar, browser menjeda JS dan membekukan halaman; ketika Back/Forward, jika snapshot yang beku masih tersedia, browser mencairkannya dan menampilkannya lagi secara instan tanpa permintaan jaringan — tetapi penghapusan snapshot selalu mungkin, jadi pemulihan harus dianggap mungkin, bukan pasti. Bfcache bukan faktor peringkat Google Search yang terdokumentasi (dokumentasi Core Web Vitals Search Central tidak pernah menyebutnya); relevansinya tidak langsung dan terbatas pada pengukuran CWV lapangan, terutama LCP dan CLS, pada navigasi yang benar-benar dipulihkan — ini tidak menjamin rasio pemulihan, skor CWV agregat, peringkat, atau konversi. Penghambat kelayakan terbesar adalah handler
unload(sekitar 18 poin persentase rasio pemulihan di Chrome); secara historis, penghambat terbesar adalahCache-Control: no-store(memblokir sekitar 17% navigasi riwayat seluler dan 7% desktop), meskipun Chrome kini mengizinkan banyak halamanno-storemenggunakan bfcache secara bersyarat setelah peluncuran 2025. Koneksi terbuka, timer, dan observer harus ditutup atau dijeda padapagehide/freeze, lalu dibuat ulang padapageshow/resume;window.opener, kebijakan izin, dan frame juga dapat memblokirnya — periksa alasan per-frame di DevTools atau melaluinotRestoredReasons, bukan dengan berasumsi. Uji satu URL dengan Chrome DevTools dan diagnosis di lapangan memakai APInotRestoredReasonskhusus Chrome (hasilnullbukan bukti pemulihan, dan teks alasannya tidak stabil). Setiap browser memiliki aturan kelayakan sendiri, dan navigasi lunak SPA tidak mendapat perlakuan yang sama.
Apa bfcache sebenarnya adalah ( accuracy spine)
single sebagian besar penting hal untuk mendapatkan right: bfcache adalah sebuah seluruh-halaman, di-memory snapshot, tidak sebuah cached respons HTTP. Ketika Anda navigate away dari sebuah halaman, rather daripada tearing ini down, browser pauses JavaScript execution dan freezes entire halaman — DOM, JS heap, di-flight timers, lot — dan holds ini di memory. jika Anda press Back atau Forward sementara itu frozen snapshot adalah masih tersedia, browser un-freezes ini dan re-displays tepat halaman Anda left, dengan zero network permintaan dan zero re-render. itu’s sebuah mungkin restore, tidak sebuah jaminan — browser dapat evict snapshot sebelum Anda navigate back (memory pressure, sebuah timeout, certain events), atau sebuah browser-spesifik aturan dapat force sebuah fresh muat, di yang case ini adalah hanya sebuah ordinary history navigation alih-alih. Google’s canonical framing adalah itu bfcache adalah “a browser optimization that enables instant back and forward navigation.” (terjemahan) “pengoptimalan browser yang memungkinkan navigasi maju dan mundur secara instan.”*
ini adalah mengapa conflating ini dengan HTTP/browser cache adalah recurring pesaing
error. HTTP cache stores respons untuk sebelumnya permintaan — files ini dapat
re-sajikan. Bfcache stores langsung, berjalan halaman. Chrome’s DevTools documentation
draws line explicitly: bfcache “differs from browser cache and HTTP cache.” (terjemahan) “berbeda dari cache browser dan cache HTTP.”*
Anda tidak “turn pada” (terjemahan) “turn pada” bfcache dengan caching headers cara Anda configure HTTP
caching — satu-satunya place headers enter picture adalah itu Cache-Control: Tidak-store digunakan untuk disqualify sebuah halaman (lebih pada itu di bawah).
yang sama pembedaan holds terhadap dua lainnya caches orang sometimes conflate
dengan bfcache: browser’s di-memory resource cache (compiled scripts dan
decoded images dipertahankan sekitar untuk saat ini session) dan sebuah service worker’s
Cache Storage (jelas permintaan/respons pairs sebuah situs manages itself melalui
caches.open()). Keduanya dapat menjadi active pada yang sama halaman pada saat yang sama sebagai
bfcache — neither satu adalah bfcache, yang adalah secara khusus frozen halaman
instance, tidak cached assets atau intercepted respons.
Satu lebih disambiguation worth stating karena ini masih penyebab confusion: bfcache memiliki tidak ada apa pun untuk melakukan dengan old “cached halaman” (terjemahan) “cached halaman” penelusuran fitur itu Google (dan Bing) setelah exposed di hasil. itu adalah sebuah stored snapshot dari sebuah halaman di penelusuran indeks, dan ini adalah telah retired. Bfcache adalah sebuah client-side, rendering-mesin fitur.
Bagaimana umum adalah Back/Forward navigations, benar-benar?
ini adalah tidak sebuah niche edge case. Per web.dev, “1 di 10 navigations pada desktop dan 1 di 5 pada mobile adalah either back atau forward.” (terjemahan) “1 di 10 navigations pada desktop dan 1 di 5 pada mobile adalah either back atau forward.” pada apa pun situs dengan repeat/back-forward alur — e-commerce category-untuk-product-dan-back, hasil pencarian, paginated konten, artikel-untuk-artikel reading — itu’s sebuah besar slice dari nyata navigations Anda dapat membuat near-instant.
browser mendukung
“All major browsers include a bfcache, including Chrome since version 96, Firefox dan Safari.” (terjemahan) “semua major browser sertakan sebuah bfcache, including Chrome since versi 96, Firefox dan Safari.” Firefox dan Safari memiliki implementasi bfcache yang sudah berjalan lebih lama, implementations; semua Chromium-based browser (Edge, Brave, Opera, Arc) inherit Chrome’s. Microsoft’s Edge policy documentation mendeskripsikan yang sama fitur: ketika navigating away dari sebuah halaman, -nya saat ini state (document tree, script, dan so pada) dapat menjadi dipertahankan di back-forward cache, dan jika browser navigates back halaman dapat menjadi restored dari ini dan displayed di state ini adalah di sebelum menjadi cached. ini adalah enabled oleh default di Edge; satu-satunya off switch adalah sebuah enterprise policy sebuah ini admin controls, tidak sebuah situs owner.
penting caveat: setiap browser’s bfcache applies -nya own eligibility aturan. sebuah halaman itu melewati Chrome DevTools’ “Test back/forward cache” (terjemahan) “Test back/forward cache” adalah tidak guaranteed untuk menjadi eligible di Firefox atau Safari. Treat sebuah Chrome lulus sebagai necessary, tidak sufficient.
Apa blocks bfcache eligibility
unload event — single biggest blocker
jika Anda take satu hal dari ini artikel: berhenti menggunakan unload event. web.dev
puts ini dengan rare emphasis untuk sebuah Google doc: “Never use the unload event.
Ever!” (terjemahan) “Jangan pernah gunakan event unload. Sama sekali!”* pada Chrome,
unload handlers cost roughly sebuah 18-percentage-poin
reduction di bfcache hit rate — oleh far largest self-inflicted disqualifier.
ada dua alasan Chrome adalah actively deprecating ini. pertama, ini adalah biggest
bfcache blocker. kedua, unload adalah extremely unreliable untuk begin dengan: pada mobile
ini frequently tidak fire di semua, karena tabs mendapatkan backgrounded dan killed dan
browser prioritizes bfcache di atas firing unload. So event Anda’re relying pada
untuk “cleanup” (terjemahan) “cleanup” sering tidak pernah berjalan dan ini adalah blocking sebuah nyata performa win.
memperbaiki:
- Replace
unloaddenganpagehide.pagehideevent fires di setiap caseunloadmelakukan, plus ketika sebuah halaman enters bfcache — so ini adalah sebuah strict upgrade. gunakanvisibilitychangeuntuk reliable “user adalah leaving” (terjemahan) “pengguna adalah leaving” cleanup. - Detect sebuah bfcache restore dengan
pageshow. Listen untukpageshowdan periksaevent.persisted— jika ini adalahtrue, halaman adalah restored dari bfcache, yang adalah Anda cue untuk refresh stale data atau re-count sebuah pageview. - Proactively block unload listeners dengan
Permissions-Policy: unload=()respons header, yang mencegah apa pununloadhandlers dari menjadi registered di semua. Chrome adalah secara bertahap migrating default policy toward deny (sebuahPermissions-Policyuntuk unload shipped dari Chrome 115).
Cache-Control: no-store — secara historis largest, now nuanced
ini adalah freshness poin sebagian besar pesaing konten mendapatkan wrong. Secara historis,
Cache-Control: no-store adalah largest single alasan halaman adalah excluded
dari bfcache — Chrome’s own figures put ini di roughly 17% dari history navigations
pada mobile dan 7% pada desktop. banyak situs set no-store defensively untuk hindari
serving sebuah stale halaman, tetapi Google’s argument adalah itu ini rationale weakens di bawah
bfcache: sebuah bfcache restore tidak memuat sebuah stale cached respons, ini adalah
re-displaying tepat langsung halaman hampir sebagai jika tab memiliki telah left open.
So Chrome changed perilaku — tetapi conditionally, tidak universally. Experiments
began di Chrome 116, dengan akhir rollout untuk 100% dari pengguna di atas March dan
April 2025: Chrome now memungkinkan bfcache untuk banyak no-store halaman, subject untuk
spesifik safety conditions alih-alih sebuah blanket exception. Per Chrome’s own
docs, ini muncul dengan nyata constraints — halaman adalah evicted dari bfcache jika
authentication state atau cookies perubahan sementara ini adalah frozen (so sebuah signed-out atau
cookie-cleared pengunjung tidak akan see sebuah stale signed-di snapshot), dan sebuah fixed list dari
APIs — yang sama open-connection APIs covered di bawah (IndexedDB, WebSocket, WebRTC,
dan rest) — masih exclude sebuah no-store halaman dari bfcache yang sama cara mereka
akan apa pun lainnya halaman. ini adalah Chrome-spesifik perilaku pada sebuah spesifik versi
range, tidak sebuah aturan Anda dapat assume lainnya browser, atau older Chrome versi, ikuti
— pull saat ini DevTools/notRestoredReasons report untuk browser dan
versi Anda’re sebenarnya testing alih-alih trusting sebuah fixed aturan dari thumb.
** practical takeaway:** apa pun guide (including older versi dari ini satu) itu
lists no-store sebagai sebuah unconditional, permanent bfcache blocker adalah stale — dan so
adalah treating ini sebagai fully solved. jika freshness genuinely penting untuk sebuah halaman,
Chrome’s docs suggest no-cache atau sebuah pendek max-age (e.g. max-age=60) rather
daripada no-store.
Open connections, observers, dan lainnya blockers
di moment dari navigation, certain open resources dapat masih block eligibility — dan persis yang ones, dan apakah mereka block outright atau hanya mendapatkan closed-dan-reconnectable, adalah browser- dan versi-spesifik. Treat list di bawah sebagai contoh dari sebuah pattern, tidak sebuah fixed, permanent blocker list:
- di-progress
fetch()/XMLHttpRequestpermintaan. - Open
IndexedDBtransactions. - Open
WebSocket/WebRTCconnections, timers, dan observers (MutationObserver,IntersectionObserver, dan similar). ini adalah sebuah actively improving area — recent Microsoft Edge rilis notes tampilkan sebuah open WebSocket now menjadi closed ketika sebuah halaman enters bfcache (alih-alih blocking caching outright), dengan reconnection recommended melaluipageshowevent’sevent.persistedperiksa. itu mirrors Chrome’s lebih luas trend dari reducing blockers alih-alih hanya excluding halaman.
umum pattern untuk bangun untuk, alih-alih memorizing sebuah fixed list: close atau
pause open connections, timers, dan observers di Anda pagehide/freeze
menangani, dan re-establish them di Anda pageshow/resume menangani ketika
event.persisted adalah benar. itu pattern survives sebuah browser mengubah persis yang
APIs block eligibility outright versus yang ones ini now hanya suspends dan lets
Anda reconnect.
window.opener, permissions policies, dan frames. sebuah window.opener
reference, certain permissions policies, dan embedded (sama- atau cross-origin)
iframes dapat juga memengaruhi eligibility — ini adalah pada checklist I distilled di
Ahrefs’ CLS guide dan di
Chrome’s docs. tetapi jangan assume yang satu adalah sebenarnya penyebab dari sebuah generic
checklist: Chrome’s DevTools panel dan notRestoredReasons API keduanya report
blocking alasan per frame — top frame dan setiap iframe secara terpisah —
karena frame sebenarnya responsible untuk sebuah block tidak selalu top-tingkat
halaman. Pull nyata alasan dari itu frame-tingkat report untuk browser Anda’re
testing alih-alih guessing dari sebuah umum list.
Getting lifecycle event/state sequence right
Mixing up apa setiap lifecycle event sebenarnya proves versus merely suggests adalah kedua sebagian besar umum correctness bug di sini, setelah eligibility mistakes di atas:
| Event / state | Sinyal | Apa ini sebenarnya berarti | Apa untuk melakukan |
|---|---|---|---|
pagehide (event.persisted === true) | Intent untuk cache | browser adalah attempting untuk freeze halaman untuk bfcache — tidak sebuah confirmed cache entry | Close/pause connections, timers, dan observers di sini; jangan assume halaman akan sebenarnya menjadi restored |
freeze | Paused | JS execution adalah paused; halaman dapat masih menjadi evicted sebelum apa pun restore | Tidak tindakan beyond apa Anda sudah melakukan di pagehide |
| (Tidak event) mungkin eviction | — | browser dapat drop sebuah frozen halaman dari memory di apa pun poin — memory pressure, sebuah timeout, sebuah browser aturan — dan ada Tidak event itu fires untuk ini | jangan rely pada cleanup code berjalan kemudian; melakukan ini unconditionally di pagehide/freeze |
pageshow (event.persisted === true) | Confirmed restore | satu-satunya reliable sinyal itu sebuah bfcache restore sebenarnya happened | Refresh time-sensitive/sensitive state, reconnect closed connections, count persis satu analytics view |
resume | Resumed | JS execution adalah unpaused setelah sebuah confirmed restore | Reconnect apa pun paused di freeze |
practical aturan: treat pagehide.persisted sebagai intent, tidak proof — halaman
mungkin masih mendapatkan evicted sebelum Anda’d ever see sebuah restore. hanya
pageshow.persisted === true adalah evidence sebuah restore happened. melakukan Anda cleanup
unconditionally di pagehide/freeze (ini adalah cheap dan safe bahkan pada sebuah ordinary
navigation), dan melakukan Anda restore-spesifik berfungsi hanya di pageshow/resume, gated
pada event.persisted, so Anda tidak refresh data atau double-count sebuah analytics view
pada sebuah plain fresh muat.
cara test dan diagnose bfcache
Lab / satu kali: Chrome DevTools
Open DevTools → Application → Background services → Back/forward cache, lalu
click “Test back/forward cache.” (terjemahan) “Test back/forward cache.” Chrome auto-navigates untuk chrome://terms/ dan
back, lalu reports either success atau sebuah spesifik list dari blocking alasan. baik untuk
memeriksa satu URL di sebuah time.
Field / production: notRestoredReasons API
Previously satu-satunya cara untuk periksa eligibility adalah itu manual, satu-URL-di-sebuah-time
DevTools test — di sana adalah Tidak cara untuk see mengapa pengguna nyata’ navigations adalah blocked.
notRestoredReasons property pada PerformanceNavigationTiming (shipped di
Chrome 123+) closes itu kesenjangan: ini reports spesifik blocking alasan(s) untuk top
frame dan sama-origin iframes di nyata data lapangan.
const nav = performance.getEntriesByType('navigation')[0];
console.log(nav.notRestoredReasons);sebuah sedikit hal untuk mendapatkan right ketika Anda gunakan ini, straight dari Chrome’s own API guidance:
- ini adalah Chrome-hanya (123+). Firefox dan Safari jangan expose sebuah equivalent field API, so Anda masih perlu manual spot-memeriksa di itu browser untuk know Anda restore rate di sana.
- sebuah
nullhasil adalah ambiguous, tidak sebuah green light. ini dapat berarti halaman adalah restored, atau ini dapat berarti browser sekadar tidak collect sebuah alasan — Chrome’s own docs say tidak untuk treatnullsebagai proof dari sebuah successful restore. - alasan text tidak sebuah stable contract. jangan hard-code string matches terhadap ini; group dan trend oleh alasan alih-alih, since tepat wording dapat perubahan di seluruh Chrome versi.
Practically: pull notRestoredReasons alongside pageshow.persisted restore
rates sebelum dan setelah sebuah perbaiki ships, bandingkan trend alih-alih sebuah single
snapshot, dan pair ini dengan sebuah manual DevTools/lab lulus di Firefox dan Safari untuk
browser API dapat’t reach. ini adalah alat untuk reach untuk ketika diagnosing
bfcache di scale di RUM/production, alih-alih memeriksa URLs satu oleh satu — hanya
jangan treat ini sebagai seluruh picture.
Bfcache dan Core Web Vitals — precise hubungan
Di sini’s nuance sebagian besar pesaing konten blurs, dan angle worth owning.
Bagaimana sebuah bfcache restore adalah diukur. browser (dan karena itu CrUX data lapangan) count sebuah bfcache-restored navigation sebagai sebuah extremely fast “halaman load” (terjemahan) “pemuatan halaman” — near-instant LCP dan, ketika halaman adalah implemented correctly (tidak ada apa pun memiliki untuk re-lay-out), effectively zero additional CLS, karena ada Tidak re-render. di DebugBear’s dunia nyata perbandingan, sebuah bfcache-restored halaman hit LCP sekitar 100ms versus ~427ms untuk sebuah uncached muat. ini adalah persis mengapa bfcache menampilkan up sebagai sebuah lever pada CLS dan LCP di my own Ahrefs CLS checklist, di mana I put ini sekadar: “Membuat sure Anda halaman adalah eligible untuk bfcache. Itu back/forward cache menjaga halaman di itu browser cache. It memungkinkan untuk instant loading dari a halaman itu adalah sudah loaded, meaning Tidak layout shifts akan happen.” (terjemahan) “pastikan Anda halaman adalah eligible untuk bfcache. back/forward cache mempertahankan halaman di browser cache. ini memungkinkan untuk instant memuat dari sebuah halaman itu adalah sudah dimuat, meaning Tidak layout shifts akan happen.”
Dua cakupan caveats worth menjadi precise tentang, since ini adalah di mana pesaing
konten tends untuk overclaim. pertama, ini hanya memengaruhi navigations CrUX classifies
sebagai back/forward (-nya navigation-type dimension) — ini says tidak ada apa pun tentang Anda
pertama-visit atau reload navigations, yang adalah majority dari traffic pada sebagian besar
situs. kedua, sebuah restore improving diukur experience untuk pengguna siapa
mendapatkan satu adalah tidak yang sama sebagai sebuah jaminan: sebuah pengguna siapa’s evicted dari bfcache (see
lifecycle table di atas) masih mendapatkan sebuah wajar, unimproved muat, so bfcache
eligibility berfungsi moves Anda restore rate among Back/Forward navigations, tidak
sebuah fixed share dari Anda total traffic — dan ini tidak jaminan Anda aggregate
field Core Web Vitals rating, Anda rankings, atau Anda conversion rate. ini adalah sebuah
nyata, measurable lever dengan sebuah spesifik, bounded cakupan, tidak sebuah umum performa
atau SEO perbaiki.
adalah bfcache sebuah peringkat factor? Tidak. ini adalah defensible, differentiated claim. Google’s own Core Web Vitals peringkat documentation melakukan tidak mention bfcache di semua. honest chain dari influence adalah: bfcache eligibility → better field CWV angka (mainly LCP/CLS) pada back/forward navigations → Core Web Vitals adalah satu input among banyak “halaman experience” (terjemahan) “pengalaman halaman” sinyal Google says align dengan apa -nya peringkat sistem sudah reward. itu’s sebuah materially weaker, lebih precise claim daripada “bfcache boosts rankings” (terjemahan) “bfcache boosts rankings” — dan ini adalah claim pesaing konten seharusnya menjadi membuat tetapi biasanya tidak careful tentang. Bfcache adalah juga, correctly, sebuah rendering-mesin fitur, tidak sebuah crawler fitur — ini memiliki tidak ada apa pun untuk melakukan dengan bagaimana Googlebot atau Bingbot crawl Anda halaman, yang adalah mengapa ada Tidak “Bing’s take pada bfcache untuk SEO” (terjemahan) “Bing’s take pada bfcache untuk SEO” cara ada untuk robots.txt atau sitemaps.
SPAs dan soft navigations. Bfcache operates pada nyata browser navigation dan history events. sebuah single-halaman app’s client-side “soft” (terjemahan) “soft” route perubahan (sebuah JS-driven view tukar itu tidak trigger sebuah sebenarnya browser navigation) adalah tidak sebuah bfcache event dan tidak mendapatkan yang sama treatment. beberapa RUM alat’ attempts untuk attribute Core Web Vitals untuk soft navigations dapat buat CrUX-vs-RUM pengukuran mismatches — worth sebuah callout jika Anda’re auditing sebuah JS-kerangka kerja situs.
Bagaimana umum adalah bfcache blockers di wild?
HTTP Archive Web Almanac
tracks ini, dan ini adalah sebuah langsung, moving area — tidak settled old news. Back di 2022
edition, setidaknya ~22% dari mobile halaman adalah ineligible untuk bfcache pada unload dan
no-store criteria alone. Since lalu, unload handler usage memiliki telah declining
di seluruh situs tiers dan devices — tetapi Cache-Control: no-store usage memiliki risen
( 2025 chapter puts ini sekitar 23% dari situs, up dari ~21% di 2024, attributed
partly untuk lebih authenticated/personalized experiences dan stricter compliance
requirements).
counter-intuitive finding worth citing: lebih besar, lebih tinggi-traffic situs adalah
disproportionately lebih mungkin untuk block mereka own bfcache. pada top 1 000 situs,
sekitar 28% dari desktop halaman dan 20% dari mobile halaman masih gunakan unload handlers,
versus hanya ~11% desktop / ~10% mobile di seluruh semua situs — sering karena bigger
situs carry lebih legacy analytics dan unload-dependent code. situs dengan paling
back/forward traffic untuk lose adalah frequently ones masih getting di mereka own cara.
Di mana ini sits
Bfcache adalah satu performa lever among several di ini cluster. -nya payoff menampilkan up
di Core Web Vitals data lapangan —
secara khusus di Cumulative Layout Shift
dan Largest Contentful Paint,
since sebuah restored halaman re-displays instantly dengan Tidak re-layout. ini adalah distinct dari
caching, yang stores files alih-alih
sebuah langsung halaman snapshot, bahkan though dua share Cache-Control header sebagai sebuah
touchpoint. ada Tidak direct tie untuk
Interaction untuk Berikutnya Paint,
so I tidak akan force satu.
AI summary
sebuah condensed take pada Advanced versi:
- Bfcache = sebuah seluruh-halaman, di-memory snapshot (DOM + JS heap + berjalan state), tidak sebuah re-fetchable respons HTTP, browser’s di-memory resource cache, atau sebuah service worker’s Cache Storage. pada navigating away browser pauses JS dan freezes halaman; pada Back/Forward, jika itu frozen snapshot adalah masih tersedia, ini un-freezes dan re-displays instantly dengan zero network permintaan — eviction adalah selalu mungkin, so sebuah restore adalah mungkin, tidak guaranteed. Dokumentasi Chrome menegaskan bahwa bfcache berbeda dari cache browser dan cache HTTP. Ini adalah juga tidak old retired “cached halaman” (terjemahan) “cached halaman” penelusuran fitur.
- Tidak sebuah peringkat factor, dan scoped. Google’s own Core Web Vitals peringkat docs tidak pernah mention bfcache. nyata chain adalah indirect: bfcache eligibility → better field CWV angka (mainly LCP/CLS) pada Back/Forward navigations itu mendapatkan restored → CWV adalah satu halaman-experience input Google says aligns dengan -nya peringkat sistem. ini tidak jaminan restore rate, aggregate CWV, rankings, atau conversion — dan ini hanya touches navigations CrUX classifies sebagai back/forward.
- Scale: “1 di 10 navigations pada desktop dan 1 di 5 pada mobile adalah either back atau forward.” (terjemahan) “1 di 10 navigations pada desktop dan 1 di 5 pada mobile adalah either back atau forward.” mendukung: Chrome since v96, plus Firefox dan Safari — tetapi setiap browser memiliki -nya own eligibility aturan.
- Biggest blocker:
unloadevent (“Never use theunloadevent. Ever!” (terjemahan) “Jangan pernah gunakan event unload. Sama sekali!”) — ~18 percentage poin dari Chrome’s hit rate. Replace denganpagehide+visibilitychange; detect restores denganpageshow/event.persisted; block unload melaluiPermissions-Policy: unload=(). Cache-Control: no-storeadalah secara historis largest blocker (~17% mobile / ~7% desktop history navigations). Chrome now memungkinkan bfcache untuk banyakno-storehalaman conditionally setelah -nya March–April 2025 rollout — evicted jika auth/cookies perubahan, masih blocked oleh yang sama open-connection APIs — dan hanya pada Chrome; older guides callingno-storesebuah absolute blocker adalah stale, dan so adalah treating ini sebagai fully solved.- lainnya blockers: di-progress fetch/XHR, timers, observers, open IndexedDB,
WebSocket/WebRTC (close/pause di
pagehide/freeze, reconnect dipageshow/resume),window.opener, permissions policies, dan frames — pull per-frame alasan dari DevTools/notRestoredReasonsalih-alih assuming. - Lifecycle correctness:
pagehide.persistedadalah intent, tidak proof; hanyapageshow.persisted === truemengonfirmasi sebuah restore. melakukan cleanup unconditionally dipagehide/freeze; melakukan restore-spesifik berfungsi (refresh sensitive data, reconnect, count satu analytics view) hanya dipageshow/resume. - Testing: Chrome DevTools “Test back/forward cache” (terjemahan) “Test back/forward cache” (satu kali lab);
Chrome-hanya
notRestoredReasonsAPI (Chrome 123+) untuk data lapangan —nulltidak proof dari sebuah restore, alasan text tidak stable, dan Firefox/Safari perlu manual spot-memeriksa. BandingkannotRestoredReasonsdanpageshow.persistedrates sebelum/setelah sebuah perbaiki. - SPAs: soft client-side navigations tidak bfcache events dan jangan mendapatkan sama treatment (sebuah sumber dari CrUX-vs-RUM mismatch).
- Adoption (Web Almanac):
no-storeusage rising (~21%→23%),unloadusage lebih tinggi pada largest situs (~28% desktop pada top 1 000) — big situs sering block mereka own bfcache.
Dokumentasi resmi
Utama-sumber documentation pada bfcache. Note sumber split: bfcache lives di Chrome / rendering-mesin docs (Google’s institutional voice pada ini), tidak di Google Penelusuran Central — itu separation adalah itself poin.
Google / Chrome
- Back/forward cache — canonical doc: definition, mechanism, 1-di-10 / 1-di-5 stat, dan
unloadguidance. - Test back/forward cache — langkah pengujian DevTools, penghambat utama, dan penjelasan bahwa bfcache berbeda dari cache browser serta cache HTTP.
- Enabling bfcache untuk Cache-Control: Tidak-store — 2025 policy perubahan, 17% / 7% figures, dan rollout timeline.
- Deprecating unload event — mengapa
unloadadalah menjadi phased out danPermissions-Policymigration. - Back/forward cache notRestoredReasons API — field diagnosis pada
PerformanceNavigationTiming(Chrome 123+). - Understanding Core Web Vitals dan Google hasil pencarian — Google Penelusuran Central’s peringkat doc; cited di sini sebagai evidence itu ini tidak pernah mentions bfcache.
Microsoft / Edge
- Microsoft Edge policy: BackForwardCacheEnabled — Edge’s definition, yang sama
unloadcaveat, dan enterprise-policy off switch.
MDN / web standards
- bfcache — MDN Glossary — umum web-dev definition dan HTTP-cache pembedaan.
- Monitoring bfcache blocking alasan — MDN — menggunakan
notRestoredReasonsdalam praktik.
Quotes dari sumber
pada—record statements dari sumber documentation. setiap tautan adalah sebuah deep tautan itu jumps untuk quoted passage pada sumber halaman.
Google / Chrome — apa bfcache adalah dan mengapa ini penting
- “Back/forward cache (or bfcache) is a browser optimization that enables instant back and forward navigation.” (terjemahan) “Back/forward cache (atau bfcache) adalah pengoptimalan browser yang memungkinkan navigasi maju dan mundur secara instan.”* — web.dev. Jump untuk quote
- “1 in 10 navigations on desktop and 1 in 5 on mobile are either back or forward. With bfcache enabled, browsers could eliminate the data transfer and time spent loading for billions of web pages every single day!” (terjemahan) “1 di 10 navigations pada desktop dan 1 di 5 pada mobile adalah either back atau forward. dengan bfcache enabled, browser dapat eliminate data transfer dan time spent memuat untuk billions dari halaman web setiap single day!” Jump untuk quote
- “All major browsers include a bfcache, including Chrome since version 96, Firefox and Safari.” (terjemahan) “semua major browser sertakan sebuah bfcache, including Chrome since versi 96, Firefox dan Safari.” Jump untuk quote
Google / Chrome — #1 optimization aturan
- “Never use the
unloadevent. Ever!” (terjemahan) “Jangan pernah gunakan event unload. Sama sekali!”* — web.dev. Jump untuk quote
Chrome DevTools — bfcache adalah tidak HTTP cache
- “Back/forward cache differs from browser cache and HTTP cache.” (terjemahan) “Back/forward cache berbeda dari cache browser dan cache HTTP.”* — Chrome DevTools docs. Jump untuk quote
Microsoft Edge — yang sama fitur, yang sama caveat
- “When navigating away from a page, its current state (document tree, script, and so on) may be preserved in the back-forward cache. If the browser navigates back to the page, the page may be restored from the back-forward cache and displayed in the state it was in before being cached.” (terjemahan) “Ketika navigating away dari sebuah halaman, -nya saat ini state (document tree, script, dan so pada) dapat menjadi dipertahankan di back-forward cache. jika browser navigates back untuk halaman, halaman dapat menjadi restored dari back-forward cache dan displayed di state ini adalah di sebelum menjadi cached.” — Microsoft Edge policy documentation. Jump untuk quote
Patrick Stox (me) — bfcache sebagai sebuah CLS lever
- “Make sure your pages are eligible for bfcache. The back/forward cache keeps pages in the browser cache. It allows for instant loading of a page that was already loaded, meaning no layout shifts will happen.” (terjemahan) “pastikan Anda halaman adalah eligible untuk bfcache. back/forward cache mempertahankan halaman di browser cache. ini memungkinkan untuk instant memuat dari sebuah halaman itu adalah sudah dimuat, meaning Tidak layout shifts akan happen.” — my Ahrefs CLS guide. Baca ini
unload dicocokkan sebagai substring tepat pada halaman sumber.
Penjelasan perbedaan bfcache dari cache browser dan cache HTTP di dokumentasi Chrome DevTools,
serta wording kebijakan Microsoft Edge, dikutip dari dokumentasi tersebut. Angka
Cache-Control: no-store Chrome
(~17% mobile / ~7% desktop) dan ~18-percentage-poin unload hit-rate cost adalah
reported sebagai terdokumentasi facts di artikel body alih-alih sebagai verbatim quotations,
since mereka tidak independently re-verified sebagai tepat substrings ini lulus. ada
Tidak pada—record statement dari sebuah Google atau Bing Penelusuran-team representative tentang
bfcache — correct attribution untuk apa pun Google-side statement adalah Chrome/web.dev
engineering docs, tidak sebuah Penelusuran liaison. Bfcache eligibility checklist
sebuah lulus untuk konfirmasi Anda halaman dapat enter back/forward cache:
- Tidak
unloadevent listeners anywhere pada halaman (yours atau ketiga-party scripts). ini adalah single biggest blocker. - Cleanup/analytics code moved dari
unloaduntukpagehidedanvisibilitychange. - sebuah
pageshowlistener memeriksaevent.persisteduntuk refresh stale data dan correctly re-count pageviews setelah sebuah bfcache restore. - pertimbangkan
Permissions-Policy: unload=()respons header untuk block apa pununloadlisteners dari menjadi registered. - Review
Cache-Control: no-store— jika Anda set ini defensively, konfirmasi Anda masih perlu ini (Chrome 2025+ memungkinkan bfcache untuk banyakno-storehalaman conditionally — evicted pada auth/cookie perubahan, masih blocked oleh yang sama open-connection APIs; jangan assume lainnya browser atau versi match); jika freshness penting, preferno-cacheatau sebuah pendekmax-age. - Tidak open connections, timers, atau observers left hanging di navigation
time — di-progress fetch/XHR, open IndexedDB transactions, WebSocket/WebRTC,
MutationObserver/IntersectionObserver(close/pause dipagehide/freeze, re-establish dipageshow/resumeketikaevent.persistedadalah benar). - Tidak
window.openerreferences, restrictive permissions policies, atau blocked frames mempertahankan halaman ineligible — periksa per-frame alasan di DevTools/notRestoredReasonsalih-alih assuming yang satu applies. - Lab test halaman di Chrome DevTools → Application → Back/forward cache → “Test back/forward cache.” (terjemahan) “Test back/forward cache.”
- Field-diagnose di scale dengan
notRestoredReasonsdi Anda RUM (Chrome-hanya; sebuahnullhasil tidak proof dari sebuah restore, dan alasan text tidak sebuah stable contract — trend oleh alasan, jangan hard-code strings). - jangan assume sebuah Chrome lulus = eligible di mana-mana — spot-periksa Firefox dan Safari, yang apply mereka own aturan.
Bfcache cheat sheet
Apa blocks ini — dan perbaiki
| Blocker | Mengapa | Perbaiki |
|---|---|---|
unload event handler | #1 blocker (~18pt hit-rate cost); unreliable anyway | gunakan pagehide + visibilitychange; Permissions-Policy: unload=() |
Cache-Control: no-store | Secara historis largest (~17% mobile / ~7% desktop) | Chrome (2025+) memungkinkan banyak no-store halaman conditionally — evicted pada auth/cookie perubahan, masih blocked oleh yang sama open-connection APIs; lainnya browser/versi dapat masih block outright |
di-progress fetch/XHR, timers, observers | Open berfungsi di navigation, browser/versi-spesifik | Close/pause di pagehide/freeze; re-establish di pageshow/resume |
| Open IndexedDB transaction | Open connection di navigation | Close/commit sebelum navigation |
| Open WebSocket / WebRTC | Open connection | Close pada pagehide; reconnect pada pageshow |
window.opener, permissions policy, frames | halaman tied untuk opener atau sebuah blocked frame | hindari / rel="noopener"; periksa per-frame alasan, jangan assume |
Events untuk know
| Event | Ketika ini fires | gunakan ini untuk |
|---|---|---|
pagehide (persisted) | setiap case unload melakukan, plus pada bfcache entry | Intent sinyal — cleanup, unload replacement (tidak proof dari sebuah restore) |
freeze | pada entering bfcache | Tidak tindakan beyond pagehide cleanup |
pageshow (persisted) | pada muat dan pada bfcache restore | satu-satunya confirmed-restore sinyal — refresh state, reconnect, count satu view |
resume | pada sebuah confirmed restore | Reconnect apa pun paused di freeze |
visibilitychange | Tab hidden/ditampilkan | Reliable “user adalah leaving” (terjemahan) “pengguna adalah leaving” berfungsi |
Test ini
| Cakupan | alat |
|---|---|
| Satu URL, lab | DevTools → Application → Back/forward cache → “Test back/forward cache” (terjemahan) “Test back/forward cache” |
| pengguna nyata, field | notRestoredReasons pada PerformanceNavigationTiming — Chrome-hanya (123+); null tidak proof dari sebuah restore |
| Firefox / Safari | Tidak field API — spot-periksa manually |
Fast facts
- Bfcache = seluruh halaman aktif di memori, bukan berkas, bukan resource cache, dan bukan service worker Cache Storage. Chrome menjelaskannya begini: “differs from browser cache and HTTP cache.” (terjemahan) “berbeda dari cache browser dan cache HTTP.”
- Tidak sebuah Google peringkat factor — Penelusuran Central’s CWV docs tidak pernah mention ini. sebuah restore improves diukur LCP/CLS untuk pengguna siapa mendapatkan satu; ini tidak jaminan restore rate, aggregate CWV, rankings, atau conversion.
- mendukung: Chrome 96+, Firefox, Safari — setiap dengan -nya own aturan.
- 1 di 10 desktop / 1 di 5 mobile navigations adalah Back/Forward.
Bfcache anti-patterns (dan myths behind them)
“Bfcache is just my HTTP/browser cache — I configure it with Cache-Control.” (terjemahan) “Bfcache hanyalah cache HTTP/browser saya — saya mengaturnya dengan Cache-Control.”**
Tidak. Bfcache adalah sebuah distinct, seluruh-halaman di-memory snapshot; Chrome’s docs say ini
“differs dari browser cache dan HTTP cache.” (terjemahan) “differs dari browser cache dan HTTP cache.” Caching headers hanya penting insofar sebagai
no-store digunakan untuk disqualify sebuah halaman. Anda tidak “turn bfcache on” (terjemahan) “turn bfcache pada” dengan cache headers.
“Bfcache is a Google ranking factor, so fixing it boosts rankings.” (terjemahan) “Bfcache adalah sebuah Google peringkat factor, so memperbaiki ini boosts rankings.” Tidak established oleh apa pun official Google Search sumber. -nya Core Web Vitals peringkat doc tidak mention bfcache. nyata hubungan adalah indirect (better field LCP/CLS pada Back/Forward navigations), yang adalah sebuah weaker, lebih precise claim.
“Cache-Control: no-store always blocks bfcache, permanently.” (terjemahan) “Cache-Control: no-store selalu memblokir bfcache secara permanen.”** Benar
secara historis — dan masih biggest historical penyebab — tetapi Tidak lebih lama
categorically benar setelah Chrome’s penuh 2025 rollout dari no-store-safe bfcache.
Guides itu predate perubahan adalah stale pada ini tepat poin — tetapi so adalah treating
ini sebagai fully solved: Chrome’s exception adalah conditional (evicted pada auth/cookie
perubahan, masih blocked oleh yang sama open-connection APIs) dan Chrome-spesifik, tidak
sebuah universal green light.
“A page that fires pagehide with persisted: true is definitely cached.” (terjemahan) “Halaman yang memicu pagehide dengan persisted: true pasti sudah di-cache.”**
Tidak — itu’s intent, tidak proof. browser dapat masih evict halaman sebelum Anda’d
ever see sebuah restore. hanya pageshow.persisted === true mengonfirmasi sebuah restore
sebenarnya happened.
“If it passes the Chrome DevTools bfcache test, it’s eligible everywhere.” (terjemahan) “jika ini melewati Chrome DevTools bfcache test, ini adalah eligible di mana-mana.” salah. Chrome, Firefox, dan Safari setiap apply mereka own restrictions; sebuah lulus di satu tidak jaminan eligibility di lainnya.
“unload is a fine way to run exit/cleanup code, so I’ll keep it.” (terjemahan) “unload adalah cara yang baik untuk menjalankan kode keluar atau pembersihan, jadi akan saya pertahankan.”** Tidak — Chrome
panggilan ini extremely unreliable (ini sering tidak fire pada mobile di semua) dan adalah
actively deprecating ini melalui sebuah Permissions-Policy, precisely karena ini adalah single
biggest bfcache blocker. gunakan pagehide + visibilitychange.
“Bfcache helps my SPA the same way it helps a multi-page site.” (terjemahan) “Bfcache helps my SPA yang sama cara ini helps sebuah multi-halaman situs.” Tidak tanpa qualification. Bfcache adalah tied untuk nyata browser navigations; sebuah client-side “soft” (terjemahan) “soft” route perubahan tidak yang sama event dan tidak mendapatkan yang sama treatment — yang juga penyebab CrUX-vs-RUM mismatches pada SPA-berat situs.
“Bfcache adalah solved / old news, tidak worth auditing.” (terjemahan) “Bfcache adalah solved / old news, tidak worth auditing.” Contradicted oleh Web
Almanac’s own data: no-store usage adalah rising, dan unload usage tetap
markedly lebih tinggi pada largest, highest-traffic situs — ones dengan paling
Back/Forward traffic untuk lose.
alat untuk testing dan diagnosing bfcache
- Chrome DevTools — Back/forward cache panel. Application → Background services →
Back/forward cache → “Test back/forward cache.” (terjemahan) “Test back/forward cache.” Auto-navigates untuk
chrome://terms/dan back, lalu reports success atau tepat blocking alasan. Best untuk sebuah satu kali, single-URL lab periksa. - **
notRestoredReasonsAPI** (Chrome 123+). Bacaperformance.getEntriesByType('navigation')[0].notRestoredReasonsdi Anda RUM untuk see pengguna nyata’ blocking alasan — including untuk sama-origin iframes — di scale, tidak hanya di sebuah manual lab test. - PageSpeed Insights / Lighthouse / CrUX. Di mana sebuah “back/forward cache” (terjemahan) “back/forward cache” recommendation atau flag biasanya surfaces pertama di sebuah audit, dan di mana field CWV benefit dari sebuah bfcache-eligible situs menampilkan up.
Permissions-Policy: unload=()header. Tidak sebuah test alat tetapi enforcement lever: set ini untuk actively mencegah apa pununloadlisteners (including ketiga-party ones) dari menjadi registered.- Web Almanac (HTTP Archive) performa chapter. untuk benchmarking bagaimana umum bfcache blockers adalah di seluruh web oleh device dan situs-peringkat tier.
DevTools says sebuah unload handler blocked restoration
Symptom: Back/forward cache test names unload. mungkin penyebab: pertama- atau
ketiga-party code registered sebuah unload listener. Perbaiki: replace cleanup dengan
pagehide/visibilitychange, tambahkan Permissions-Policy: unload=() di mana appropriate,
dan rerun test setelah setiap affected script perubahan.
sebuah restored halaman menampilkan stale pengguna data
Symptom: Back mengembalikan instantly tetapi account state, inventory, atau lainnya dynamic
nilai adalah stale. mungkin penyebab: halaman resumed -nya frozen state tanpa refreshing
time-sensitive data. Perbaiki: listen untuk pageshow, periksa event.persisted, dan
refresh hanya diperlukan data. Konfirmasi keduanya ordinary memuat dan restores behave.
Analytics misses atau doubles Back/Forward views
Symptom: pageviews differ dari sebenarnya history navigations. mungkin penyebab:
analytics berjalan hanya pada original muat atau berjalan twice tanpa distinguishing sebuah
restore. Perbaiki: tangani pageshow explicitly dan gunakan event.persisted untuk count
restored navigation setelah.
Lab melewati tetapi field restoration tetap rendah
Symptom: sebuah sampled URL melewati DevTools sementara RUM reports banyak non-restores.
mungkin penyebab: lainnya templates, browser, nyata-pengguna status, atau intermittent open
connections tambahkan blockers. Perbaiki: collect notRestoredReasons, group oleh alasan dan
template, dan reproduce dominant field case alih-alih extrapolating satu lulus.
Prove sebuah bfcache perbaiki landed
Eligibility test
Test untuk jalankan: DevTools → Application → Back/forward cache → Test back/forward cache. Yang diharapkan hasil: halaman restores successfully dengan Tidak blocking alasan. Failure interpretation: setidaknya satu eligibility blocker tetap. Monitoring window: immediate untuk Chrome pada tested state. Rollback trigger: perbaiki breaks cleanup, security, atau diperlukan application perilaku.
Restore-perilaku test
Test untuk jalankan: navigate away dan Back, lalu verify pageshow menerima
event.persisted === true dan time-sensitive data refreshes. Yang diharapkan hasil: satu
instant restore, correct data, dan satu analytics view. Failure interpretation:
halaman either adalah tidak cached atau restore menangani adalah incomplete. Monitoring window:
immediate di seluruh representative signed-di/out status. Rollback trigger: stale
sensitive data atau duplicated tindakan setelah restore.
Field-alasan test
Test untuk jalankan: monitor PerformanceNavigationTiming.notRestoredReasons di RUM.
Yang diharapkan hasil: targeted blocker declines untuk affected templates tanpa sebuah
baru dominant blocker replacing ini. Failure interpretation: lab sample melakukan tidak
mewakili production atau lainnya dependency owns issue. Monitoring window:
cukup nyata Back/Forward traffic untuk bandingkan yang sama template mix. Rollback trigger:
sebuah material application atau data-integrity regression tied untuk perubahan.
Bfcache metrics worth mempertahankan
Restore hit rate
Metric: eligible Back/Forward navigations restored dari bfcache. Apa ini tells
Anda: bagaimana sering pengguna menerima instant-navigation benefit. cara pull ini: RUM
navigation entries dan pageshow.persisted, segmented oleh browser dan template.
Benchmark / realistic range: establish Anda own baseline karena browser aturan,
halaman state, dan navigation mix differ. Cadence: weekly dan setelah lifecycle perubahan.
Non-restore alasan
Metric: history navigations grouped oleh notRestoredReasons. Apa ini tells Anda:
yang blockers cost paling nyata restores. cara pull ini:
PerformanceNavigationTiming API di supporting browser. Benchmark / realistic
range: target zero untuk blockers Anda own code controls, sementara labeling browser/API
coverage. Cadence: weekly triage.
Restored-navigation correctness
Metric: errors, stale-data incidents, dan duplicate analytics/tindakan setelah sebuah
restore. Apa ini tells Anda: apakah lebih tinggi eligibility preserves application
correctness. cara pull ini: RUM error events, application monitoring, dan
analytics QA keyed untuk pageshow.persisted. Benchmark / realistic range: zero
known correctness atau privacy failures. Cadence: continuous alerting dan rilis QA.
Resources worth Anda time
My related writing
- Apa adalah Cumulative Layout Shift (CLS) & cara meningkatkan ini — di mana I list bfcache eligibility sebagai sebuah CLS-improvement tactic, dengan pendek blocker checklist.
- Apa adalah Core Web Vitals (CWVs) & cara meningkatkan Them — parent metrics, dengan bfcache sebagai satu CLS lever among banyak.
- Beginner’s Guide untuk SEO teknis — di mana web performa fits di bigger picture.
My speaking
- Bagaimana Penelusuran berfungsi (SlideShare) — my walkthrough dari crawling, rendering, pengindeksan, dan peringkat, untuk context pada mengapa sebuah rendering-mesin fitur like bfcache sits di luar Penelusuran’s sinyal peringkat. (My standing disclaimer applies: “Ini adalah my understanding dari sistem… tidak going untuk menjadi 100% menyelesaikan atau accurate.” (terjemahan) “ini adalah my understanding dari sistem… tidak going untuk menjadi 100% menyelesaikan atau accurate.”)
Official
- Back/forward cache (web.dev) — canonical doc.
- Enabling bfcache untuk Cache-Control: Tidak-store dan Deprecating unload event (Chrome untuk Developers) — dua perubahan itu membuat older guides stale.
- Understanding Core Web Vitals dan Google hasil pencarian (Google Search Central) — peringkat doc itu, tellingly, tidak pernah mentions bfcache.
dari sekitar industry
- bfcache — MDN Glossary — accurate, mesin-neutral definition dan HTTP-cache pembedaan.
- Apa melakukan Back/Forward Cache berarti untuk situs Speed? (DebugBear) — paling data-driven piece di ini space, dengan sebuah nyata-situs log dan sebuah concrete LCP perbandingan (~100ms cached vs ~427ms uncached).
- Back Forward Cache dijelaskan (SpeedVitals) — mechanics, eligibility, testing, dan CWV impact.
- Back/Forward Cache: Apa ini adalah dan cara Implement ini (NitroPack) — implementation-focused, untuk sebuah CMS/hosting audience.
- performa Game Changer: browser Back/Forward Cache (Smashing Magazine) — sebuah solid teknis deep-dive, tetapi note ini lebih lama dari 2025
no-storeperubahan. - Web Almanac — performa chapter (2025) (HTTP Archive) — dunia nyata adoption data pada
unloaddanno-storeprevalence oleh device dan situs-peringkat tier.
Stats worth citing
- Back/Forward navigations adalah umum: “1 di 10 navigations pada desktop dan 1 di 5 pada mobile adalah either back atau forward” (terjemahan) “1 di 10 navigations pada desktop dan 1 di 5 pada mobile adalah either back atau forward” — scale dari opportunity, tidak sebuah niche case. Sumber
unloadcosts ~18 percentage poin dari bfcache hit rate pada Chrome — yang adalah mengapa ini adalah #1 blocker dan menjadi deprecated. SumberCache-Control: no-storeadalah largest historical blocker — roughly 17% dari history navigations pada mobile dan 7% pada desktop — sebelum Chrome’s March–April 2025 rollout diizinkan bfcache untuk banyakno-storehalaman. Sumber- sebuah bfcache restore adalah near-instant: DebugBear diukur LCP sekitar 100ms untuk sebuah restored halaman versus ~427ms untuk sebuah uncached muat. Sumber
- Big situs block themselves paling: pada top 1 000 situs, ~28% dari desktop
dan ~20% dari mobile halaman masih gunakan
unloadhandlers, versus ~11% / ~10% di seluruh semua situs — danno-storeusage adalah rising (~21%→23%). Sumber
Uji pemahaman Anda: Back/Forward Cache (bfcache)
Five quick pertanyaan pada apa bfcache adalah, apa blocks ini, dan bagaimana ini relates untuk SEO. Pick sebuah jawaban untuk setiap, lalu periksa.
Log perubahan
Diperbarui 8 Agu 2026.
Ringkasan editorial dan detail perubahan yang tercatat.Detail perubahan
-
Catatan perubahan terperinci saat ini tersedia dalam bahasa Inggris.
Perbandingan lengkap tidak tersedia — tidak ada cuplikan sebelumnya yang diarsipkan untuk revisi ini.
Diperbarui 17 Jul 2026.
Ringkasan editorial dan detail perubahan yang tercatat.Detail perubahan
-
Catatan perubahan terperinci saat ini tersedia dalam bahasa Inggris.
-
Catatan perubahan terperinci saat ini tersedia dalam bahasa Inggris.
-
Catatan perubahan terperinci saat ini tersedia dalam bahasa Inggris.
Perbandingan lengkap tidak tersedia — tidak ada cuplikan sebelumnya yang diarsipkan untuk revisi ini.