ข้อมูลเบื้องต้น
Back-Forward Cache (bfcache) จะจัดเก็บภาพรวมของหน้าในหน่วยความจําสําหรับกรณีที่ระบบกู้คืนหน้าจากประวัติการไปยังส่วนต่างๆ ซึ่งจะช่วยเร่งการไปยังส่วนต่างๆ แบบย้อนกลับไปยังหน้าเว็บได้อย่างมาก อย่างไรก็ตาม API เบราว์เซอร์บางรายการ (เช่น รายการฟังก์ชันการยกเลิกการโหลด) อาจทําให้ bfcache ไม่สําเร็จและหน้าเว็บจะโหลดตามปกติ
วิธีที่ Lighthouse ตรวจหาข้อผิดพลาดของ bfcache
การนำทางแบบสแตนด์อโลน
เมื่อการนําทางแบบสแตนด์อโลนสิ้นสุดลง Lighthouse จะนําทางออกและพยายามกู้คืนหน้าเว็บจากประวัติการนําทางเพื่อตรวจหาว่ามีการใช้ 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 พร้อมกับเฟรมที่ทำให้เกิดปัญหา สาเหตุของการไม่ผ่านการตรวจสอบมี 3 ประเภท ได้แก่
- แก้ไขได้: คุณแก้ไขปัญหาเหล่านี้เพื่อเปิดใช้การแคชได้
- รอการสนับสนุน: Chrome ยังไม่รองรับฟีเจอร์เหล่านี้ จึงป้องกันไม่ให้แคช อย่างไรก็ตาม เมื่อรองรับแล้ว Chrome จะยกเลิกข้อจำกัดเหล่านี้
- ดำเนินการไม่ได้: คุณแก้ไขปัญหาเหล่านี้ในหน้านี้ไม่ได้ มีบางอย่างที่อยู่นอกเหนือการควบคุมของหน้าเว็บซึ่งป้องกันการแคช
