Đảm bảo có thể khôi phục trang từ bộ nhớ đệm cho thao tác tiến/lùi

Thông tin khái quát

Bộ nhớ đệm cho thao tác tiến/lùi (bfcache) lưu ảnh chụp nhanh của trang trong bộ nhớ khi trang được khôi phục từ nhật ký điều hướng. Điều này giúp tăng tốc đáng kể các thao tác trả về trang, tuy nhiên, một số API trình duyệt (ví dụ: trình nghe huỷ tải) có thể khiến bfcache không hoạt động được và trang sẽ được tải bình thường.

Cách Lighthouse phát hiện lỗi bfcache

Thành phần điều hướng độc lập

Khi bạn kết thúc một thao tác điều hướng độc lập, Lighthouse sẽ di chuyển sang trang khác và cố gắng khôi phục trang từ nhật ký điều hướng để xem liệu bfcache có đang được sử dụng hay không.

Luồng người dùng

Lighthouse sẽ không chủ động kiểm thử bfcache trong chế độ điều hướng khi chạy luồng người dùng. Nguyên nhân là do việc rời đi và quay lại trang ở cuối mỗi lần điều hướng không phản ánh hầu hết trải nghiệm người dùng trên trang.

Tuy nhiên, bạn vẫn có thể kiểm thử việc sử dụng bfcache trong chế độ khoảng thời gian bằng cách thêm tính năng điều hướng nhật ký vào hành trình của người dùng. Ví dụ:

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();

Tìm hiểu về lỗi bfcache

Nếu không thể khôi phục trang từ bfcache vì bất kỳ lý do nào, thì quá trình kiểm tra sẽ không thành công. Lighthouse sẽ liệt kê mọi lý do khiến không thể sử dụng bfcache cùng với(các) khung gây ra vấn đề này. Có 1 trong 3 loại nguyên nhân không thành công:

  • Có thể thao tác: Bạn có thể khắc phục những vấn đề này để bật tính năng lưu vào bộ nhớ đệm.
  • Hỗ trợ đang chờ xử lý: Chrome chưa hỗ trợ các tính năng này, do đó các tính năng này sẽ ngăn việc lưu vào bộ nhớ đệm. Tuy nhiên, sau khi được hỗ trợ, Chrome sẽ xoá các giới hạn này.
  • Không thể xử lý: Bạn không thể khắc phục những vấn đề trên trang này. Nội dung nào đó nằm ngoài tầm kiểm soát của trang sẽ ngăn việc lưu vào bộ nhớ đệm.

Kết quả mẫu từ quá trình kiểm tra bộ nhớ đệm cho thao tác tiến/lùi của Lighthouse

Tài nguyên