確保網頁可以從往返快取還原
透過集合功能整理內容
你可以依據偏好儲存及分類內容。
背景
往返快取 (bfcache) 會將網頁的快照儲存在記憶體中,以供從導覽記錄還原頁面時使用。這可以大幅加快返回網頁的瀏覽速度,但某些瀏覽器 API (例如:卸載事件監聽器) 可能會造成 bfcache 失敗,進而正常載入網頁。
Lighthouse 如何偵測 bfcache 失敗
獨立導覽功能
獨立導覽結束時,Lighthouse 會離開並嘗試透過導覽記錄還原頁面,偵測是否使用 bfcache。
使用者流程
注意: 由於網頁凍結 ,Puppeteer 會預設停用 bfcache,即使使用者能夠查看從 bfcache 還原的網頁,Puppeteer 指令碼也無法從 bfcache 還原網頁。
執行使用者流程時,Lighthouse 不會主動測試導覽中的 bfcache。這是因為每次都離開頁面後返回網頁,並不會反映網頁上的大部分使用者體驗。
不過,您還是可以在使用者歷程中加入歷史記錄導覽,藉此在時間範圍模式下測試 bfcache 使用情形。例如:
const flow = await startFlow(page);
// This navigation will not test the bfcache
// because it is part of a user flow.
await flow.navigate('https://example.com');
// This timespan will try to restore the page from the bfcache.
// Problems restoring from the bfcache are surfaced in this report.
await flow.startTimespan();
await page.goto('https://example2.com');
await page.goBack();
await flow.endTimespan();
瞭解 bfcache 失敗
如果因任何原因無法從 bfcache 還原網頁,稽核作業就會失敗。Lighthouse 會列出無法使用 bfcache 的所有原因,以及造成問題的影格。失敗原因有以下三種:
可採取行動 :您可以修正這些問題來啟用快取。
待支援 :Chrome 尚未支援這些功能,因此會禁止快取。不過,一旦支援,Chrome 就會移除這些限制。
無法採取行動 :您無法在這個頁面修正這些問題。超出網頁控制的項目會導致快取。
資源
除非另有註明,否則本頁面中的內容是採用創用 CC 姓名標示 4.0 授權 ,程式碼範例則為阿帕契 2.0 授權 。詳情請參閱《Google Developers 網站政策 》。Java 是 Oracle 和/或其關聯企業的註冊商標。
上次更新時間:2023-01-12 (世界標準時間)。
[{
"type": "thumb-down",
"id": "missingTheInformationINeed",
"label":"缺少我需要的資訊"
},{
"type": "thumb-down",
"id": "tooComplicatedTooManySteps",
"label":"過於複雜/步驟過多"
},{
"type": "thumb-down",
"id": "outOfDate",
"label":"過時"
},{
"type": "thumb-down",
"id": "translationIssue",
"label":"翻譯問題"
},{
"type": "thumb-down",
"id": "samplesCodeIssue",
"label":"示例/程式碼問題"
},{
"type": "thumb-down",
"id": "otherDown",
"label":"其他"
}]
[{
"type": "thumb-up",
"id": "easyToUnderstand",
"label":"容易理解"
},{
"type": "thumb-up",
"id": "solvedMyProblem",
"label":"確實解決了我的問題"
},{
"type": "thumb-up",
"id": "otherUp",
"label":"其他"
}]
{"lastModified": "\u4e0a\u6b21\u66f4\u65b0\u6642\u9593\uff1a2023-01-12 (\u4e16\u754c\u6a19\u6e96\u6642\u9593)\u3002"}
[[["容易理解","easyToUnderstand","thumb-up"],["確實解決了我的問題","solvedMyProblem","thumb-up"],["其他","otherUp","thumb-up"]],[["缺少我需要的資訊","missingTheInformationINeed","thumb-down"],["過於複雜/步驟過多","tooComplicatedTooManySteps","thumb-down"],["過時","outOfDate","thumb-down"],["翻譯問題","translationIssue","thumb-down"],["示例/程式碼問題","samplesCodeIssue","thumb-down"],["其他","otherDown","thumb-down"]],["上次更新時間:2023-01-12 (世界標準時間)。"],[],[]]