Ưu và nhược điểm của việc sử dụng logic hết hạn nhất quán hoặc khác nhau trên bộ nhớ đệm của trình chạy dịch vụ và các lớp bộ nhớ đệm HTTP.
Mặc dù trình chạy dịch vụ và PWA đang trở thành tiêu chuẩn của các ứng dụng web hiện đại, nhưng việc lưu tài nguyên vào bộ nhớ đệm đang trở nên phức tạp hơn bao giờ hết. Bài viết này trình bày thông tin tổng quan về việc lưu vào bộ nhớ đệm của trình duyệt, bao gồm:
- Trường hợp sử dụng và sự khác biệt giữa lưu vào bộ nhớ đệm của trình chạy dịch vụ và lưu vào bộ nhớ đệm của HTTP.
- Ưu và nhược điểm của các chiến lược hết hạn lưu vào bộ nhớ đệm của trình chạy dịch vụ so với các chiến lược lưu vào bộ nhớ đệm HTTP thông thường.
Tổng quan về quy trình lưu vào bộ nhớ đệm
Ở cấp độ cao, trình duyệt sẽ tuân theo thứ tự lưu vào bộ nhớ đệm dưới đây khi yêu cầu tài nguyên:
- Bộ nhớ đệm của trình chạy dịch vụ: Trình chạy dịch vụ kiểm tra xem tài nguyên có trong bộ nhớ đệm hay không và quyết định có trả về tài nguyên đó dựa trên chiến lược lưu vào bộ nhớ đệm đã lập trình hay không. Xin lưu ý rằng việc này không tự động xảy ra. Bạn cần tạo một trình xử lý sự kiện tìm nạp trong trình chạy dịch vụ và chặn các yêu cầu mạng để các yêu cầu được phân phát từ bộ nhớ đệm của trình chạy dịch vụ thay vì từ mạng.
- Bộ nhớ đệm HTTP (còn gọi là bộ nhớ đệm của trình duyệt): Nếu tài nguyên được tìm thấy trong Bộ nhớ đệm HTTP và chưa hết hạn, thì trình duyệt sẽ tự động sử dụng tài nguyên trong bộ nhớ đệm HTTP.
- phía máy chủ: Nếu không tìm thấy gì trong bộ nhớ đệm của trình chạy dịch vụ hoặc bộ nhớ đệm HTTP, thì trình duyệt sẽ truy cập vào mạng để yêu cầu tài nguyên. Nếu tài nguyên không được lưu vào bộ nhớ đệm trong CDN, thì yêu cầu phải quay lại máy chủ gốc.
Lưu các lớp vào bộ nhớ đệm
Lưu vào bộ nhớ đệm của trình chạy dịch vụ
Trình chạy dịch vụ sẽ chặn các yêu cầu HTTP loại mạng và sử dụng chiến lược lưu vào bộ nhớ đệm để xác định tài nguyên nào sẽ được trả về trình duyệt. Bộ nhớ đệm của trình chạy dịch vụ và bộ nhớ đệm HTTP có cùng mục đích chung, nhưng bộ nhớ đệm của trình chạy dịch vụ cung cấp thêm khả năng lưu vào bộ nhớ đệm, chẳng hạn như kiểm soát chi tiết chính xác những gì được lưu vào bộ nhớ đệm và cách lưu vào bộ nhớ đệm.
Kiểm soát bộ nhớ đệm của trình chạy dịch vụ
Trình chạy dịch vụ chặn các yêu cầu HTTP bằng trình nghe sự kiện (thường là sự kiện fetch). Đoạn mã này minh hoạ logic của chiến lược lưu vào bộ nhớ đệm Ưu tiên bộ nhớ đệm.
Bạn nên sử dụng Workbox để tránh phải đổi mới vô lăng. Ví dụ: bạn có thể đăng ký đường dẫn URL tài nguyên bằng một dòng mã biểu thức chính quy.
import {registerRoute} from 'workbox-routing';
registerRoute(new RegExp('styles/.*\\.css'), callbackHandler);
Các trường hợp sử dụng và chiến lược lưu vào bộ nhớ đệm của trình chạy dịch vụ
Bảng tiếp theo trình bày các chiến lược lưu vào bộ nhớ đệm phổ biến của trình chạy dịch vụ và thời điểm mỗi chiến lược hữu ích.
| Chiến lược | Lý do khiến tính mới mẻ | Trường hợp sử dụng |
|---|---|---|
| Chỉ mạng | Nội dung phải luôn cập nhật. |
|
| Mạng sẽ quay lại sử dụng bộ nhớ đệm | Bạn nên phân phát nội dung mới. Tuy nhiên, nếu mạng bị lỗi hoặc không ổn định, bạn có thể phân phát nội dung hơi cũ. |
|
| Đã lỗi thời trong khi xác thực lại | Bạn có thể phân phát nội dung đã lưu vào bộ nhớ đệm ngay lập tức, nhưng nội dung đã lưu vào bộ nhớ đệm đã được cập nhật sẽ được sử dụng trong tương lai. |
|
| Lưu vào bộ nhớ đệm trước rồi mới quay lại sử dụng mạng | Nội dung không quan trọng và có thể được phân phát từ bộ nhớ đệm để tăng hiệu suất, nhưng trình chạy dịch vụ thỉnh thoảng nên kiểm tra để tìm các bản cập nhật. |
|
| Chỉ lưu vào bộ nhớ đệm | Nội dung hiếm khi thay đổi. |
|
Các lợi ích khác của việc lưu vào bộ nhớ đệm của trình chạy dịch vụ
Ngoài việc kiểm soát chi tiết logic lưu vào bộ nhớ đệm, chức năng lưu vào bộ nhớ đệm của trình chạy dịch vụ cũng mang lại:
- Thêm bộ nhớ và dung lượng lưu trữ cho nguồn gốc của bạn: Trình duyệt phân bổ tài nguyên bộ nhớ đệm HTTP trên cơ sở từng nguồn gốc. Nói cách khác, nếu bạn có nhiều miền con, thì tất cả các miền con đó sẽ dùng chung cùng một bộ nhớ đệm HTTP. Không có điều gì đảm bảo rằng nội dung trong nguồn gốc/miền của bạn sẽ nằm trong bộ nhớ đệm HTTP trong thời gian dài. Ví dụ: người dùng có thể xoá hoàn toàn bộ nhớ đệm bằng cách dọn dẹp theo cách thủ công khỏi giao diện người dùng cài đặt của trình duyệt hoặc kích hoạt thao tác tải lại cứng trên một trang. Với bộ nhớ đệm của trình chạy dịch vụ, khả năng cao hơn nhiều là nội dung đã lưu vào bộ nhớ đệm sẽ được lưu vào bộ nhớ đệm. Xem bài viết Bộ nhớ liên tục để tìm hiểu thêm.
- Tính linh hoạt cao hơn với mạng không ổn định hoặc trải nghiệm ngoại tuyến: Với bộ nhớ đệm HTTP, bạn chỉ có lựa chọn nhị phân: tài nguyên có được lưu vào bộ nhớ đệm hoặc không. Với tính năng lưu vào bộ nhớ đệm của trình chạy dịch vụ, bạn có thể giảm thiểu các "lượt gián đoạn" nhỏ dễ dàng hơn (với chiến lược "lỗi thời trong khi xác thực lại"), cung cấp trải nghiệm ngoại tuyến hoàn chỉnh (với chiến lược "Chỉ lưu vào bộ nhớ đệm") hoặc thậm chí là trải nghiệm ở giữa, chẳng hạn như giao diện người dùng tuỳ chỉnh với các phần của trang đến từ bộ nhớ đệm của trình chạy dịch vụ và một số phần bị loại trừ (bằng chiến lược "Đặt trình xử lý bắt") khi thích hợp.
Lưu vào bộ nhớ đệm của HTTP
Lần đầu tiên tải một trang web và các tài nguyên liên quan, trình duyệt sẽ lưu trữ các tài nguyên này trong bộ nhớ đệm HTTP. Bộ nhớ đệm HTTP thường được trình duyệt bật tự động, trừ phi người dùng cuối vô hiệu hoá một cách rõ ràng.
Việc sử dụng chức năng lưu vào bộ nhớ đệm của HTTP có nghĩa là dựa vào máy chủ để xác định thời điểm và thời gian lưu tài nguyên vào bộ nhớ đệm.
Kiểm soát thời gian hết hạn bộ nhớ đệm HTTP bằng tiêu đề phản hồi HTTP
Khi phản hồi yêu cầu của trình duyệt về tài nguyên, máy chủ sẽ sử dụng tiêu đề phản hồi HTTP để thông báo cho trình duyệt biết cần lưu tài nguyên vào bộ nhớ đệm trong bao lâu. Xem phần Tiêu đề phản hồi: định cấu hình máy chủ web để tìm hiểu thêm.
Các trường hợp sử dụng và chiến lược lưu vào bộ nhớ đệm của HTTP
Việc lưu vào bộ nhớ đệm của HTTP đơn giản hơn nhiều so với việc lưu vào bộ nhớ đệm của trình chạy dịch vụ, vì việc lưu vào bộ nhớ đệm HTTP chỉ xử lý logic hết hạn tài nguyên dựa trên thời gian (TTL). Hãy xem phần Bạn nên sử dụng những giá trị tiêu đề phản hồi nào? và Tóm tắt để tìm hiểu thêm về các chiến lược lưu vào bộ nhớ đệm HTTP.
Thiết kế logic hết hạn bộ nhớ đệm
Phần này giải thích ưu và nhược điểm của việc sử dụng logic hết hạn nhất quán trên các lớp bộ nhớ đệm của trình chạy dịch vụ và bộ nhớ đệm HTTP, cũng như ưu và nhược điểm của logic hết hạn riêng biệt giữa các lớp này.
Sự cố dưới đây minh hoạ cách hoạt động của chức năng lưu vào bộ nhớ đệm của trình chạy dịch vụ và lưu vào bộ nhớ đệm của HTTP trong nhiều trường hợp:
Logic hết hạn nhất quán cho tất cả các lớp bộ nhớ đệm
Để minh hoạ các ưu và nhược điểm, chúng tôi sẽ xem xét 3 phương án: dài hạn, trung hạn và ngắn hạn.
| Tình huống | Lưu vào bộ nhớ đệm trong thời gian dài | Lưu vào bộ nhớ đệm trung hạn | Lưu vào bộ nhớ đệm trong thời gian ngắn |
|---|---|---|---|
| Chiến lược lưu vào bộ nhớ đệm của trình chạy dịch vụ | Vào bộ nhớ đệm, quay trở lại mạng | Phiên bản cũ trong khi xác thực lại | Mạng trở lại bộ nhớ đệm |
| TTL của bộ nhớ đệm của trình chạy dịch vụ | 30 ngày | 1 ngày | 10 phút |
| Thời gian tối đa của bộ nhớ đệm HTTP | 30 ngày | 1 ngày | 10 phút |
Tình huống: Lưu vào bộ nhớ đệm trong thời gian dài (Bộ nhớ đệm, quay lại sử dụng mạng)
- Khi một tài nguyên được lưu vào bộ nhớ đệm hợp lệ (<= 30 ngày): Trình chạy dịch vụ sẽ trả về tài nguyên đã lưu vào bộ nhớ đệm ngay lập tức mà không cần chuyển đến mạng.
- Khi tài nguyên được lưu vào bộ nhớ đệm hết hạn (> 30 ngày): Trình chạy dịch vụ sẽ truy cập vào mạng để tìm nạp tài nguyên. Trình duyệt không có bản sao của tài nguyên trong bộ nhớ đệm HTTP, nên trình duyệt sẽ chuyển tài nguyên sang phía máy chủ.
Nhược điểm: Trong trường hợp này, việc lưu vào bộ nhớ đệm HTTP cung cấp ít giá trị hơn vì trình duyệt sẽ luôn truyền yêu cầu phía máy chủ khi bộ nhớ đệm hết hạn trong trình chạy dịch vụ.
Tình huống: Lưu vào bộ nhớ đệm trung hạn (Đã lỗi thời trong khi xác thực lại)
- Khi tài nguyên đã lưu vào bộ nhớ đệm hợp lệ (<= 1 ngày): Service worker sẽ ngay lập tức trả về tài nguyên đã lưu vào bộ nhớ đệm và chuyển đến mạng để tìm nạp tài nguyên. Trình duyệt có một bản sao của tài nguyên trong bộ nhớ đệm HTTP nên trình duyệt sẽ trả về bản sao đó cho trình chạy dịch vụ.
- Khi tài nguyên đã lưu vào bộ nhớ đệm hết hạn (> 1 ngày): Trình chạy dịch vụ sẽ ngay lập tức trả về tài nguyên đã lưu vào bộ nhớ đệm và chuyển đến mạng để tìm nạp tài nguyên. Trình duyệt không có bản sao của tài nguyên trong bộ nhớ đệm HTTP nên trình duyệt sẽ chuyển sang phía máy chủ để tìm nạp tài nguyên.
Nhược điểm: Trình chạy dịch vụ yêu cầu thêm tính năng chặn truy xuất bộ nhớ đệm để ghi đè bộ nhớ đệm HTTP nhằm khai thác tối đa bước "xác thực lại".
Tình huống: Lưu vào bộ nhớ đệm trong thời gian ngắn (Mạng trở lại bộ nhớ đệm)
- Khi một tài nguyên được lưu vào bộ nhớ đệm hợp lệ (<= 10 phút): Trình chạy dịch vụ sẽ truy cập vào mạng để tìm nạp tài nguyên. Trình duyệt có một bản sao của tài nguyên trong bộ nhớ đệm HTTP để trình duyệt trả về tài nguyên đó cho trình chạy dịch vụ mà không cần chuyển sang phía máy chủ.
- Khi một tài nguyên đã lưu vào bộ nhớ đệm hết hạn (> 10 phút): Service worker sẽ trả về tài nguyên đã lưu vào bộ nhớ đệm ngay lập tức và chuyển đến mạng để tìm nạp tài nguyên. Trình duyệt không có bản sao của tài nguyên trong bộ nhớ đệm HTTP nên trình duyệt sẽ chuyển sang phía máy chủ để tìm nạp tài nguyên.
Nhược điểm: Tương tự như trường hợp lưu vào bộ nhớ đệm trung hạn, trình chạy dịch vụ yêu cầu thêm logic chặn truy xuất bộ nhớ đệm để ghi đè bộ nhớ đệm HTTP nhằm tìm nạp tài nguyên mới nhất từ phía máy chủ.
Trình chạy dịch vụ trong mọi trường hợp
Trong mọi trường hợp, bộ nhớ đệm của trình chạy dịch vụ vẫn có thể trả về tài nguyên được lưu vào bộ nhớ đệm khi mạng không ổn định. Mặt khác, bộ nhớ đệm HTTP không đáng tin cậy khi mạng không ổn định hoặc ngừng hoạt động.
Logic hết hạn bộ nhớ đệm khác nhau tại bộ nhớ đệm của trình chạy dịch vụ và các lớp HTTP
Để minh hoạ các ưu và nhược điểm, chúng tôi sẽ xem xét lại các trường hợp dài hạn, trung hạn và ngắn hạn.
| Tình huống | Lưu vào bộ nhớ đệm trong thời gian dài | Lưu vào bộ nhớ đệm trung hạn | Lưu vào bộ nhớ đệm trong thời gian ngắn |
|---|---|---|---|
| Chiến lược lưu vào bộ nhớ đệm của trình chạy dịch vụ | Vào bộ nhớ đệm, quay trở lại mạng | Phiên bản cũ trong khi xác thực lại | Mạng trở lại bộ nhớ đệm |
| TTL của bộ nhớ đệm của trình chạy dịch vụ | 90 ngày | 30 ngày | 1 ngày |
| Thời gian tối đa của bộ nhớ đệm HTTP | 30 ngày | 1 ngày | 10 phút |
Tình huống: Lưu vào bộ nhớ đệm trong thời gian dài (Bộ nhớ đệm, quay lại sử dụng mạng)
- Khi một tài nguyên đã lưu vào bộ nhớ đệm hợp lệ trong bộ nhớ đệm của trình chạy dịch vụ (<= 90 ngày): Trình chạy dịch vụ sẽ trả về tài nguyên đã lưu vào bộ nhớ đệm ngay lập tức.
- Khi một tài nguyên đã lưu vào bộ nhớ đệm hết hạn trong bộ nhớ đệm của trình chạy dịch vụ (> 90 ngày): Trình chạy dịch vụ sẽ truy cập vào mạng để tìm nạp tài nguyên. Trình duyệt không có bản sao của tài nguyên trong bộ nhớ đệm HTTP, nên trình duyệt sẽ chuyển sang phía máy chủ.
Ưu và nhược điểm:
- Ưu điểm: Người dùng trải nghiệm phản hồi tức thì khi trình chạy dịch vụ trả về ngay các tài nguyên đã lưu vào bộ nhớ đệm.
- Ưu điểm: Trình chạy dịch vụ có quyền kiểm soát chi tiết hơn về thời điểm sử dụng bộ nhớ đệm và thời điểm yêu cầu phiên bản tài nguyên mới.
- Nhược điểm: Cần có chiến lược lưu vào bộ nhớ đệm của trình chạy dịch vụ được xác định rõ ràng.
Tình huống: Lưu vào bộ nhớ đệm giữa kỳ (Đã lỗi thời trong khi xác thực lại)
- Khi một tài nguyên đã lưu vào bộ nhớ đệm hợp lệ trong bộ nhớ đệm của trình chạy dịch vụ (<= 30 ngày): Trình chạy dịch vụ sẽ trả về tài nguyên đã lưu vào bộ nhớ đệm ngay lập tức.
- Khi một tài nguyên đã lưu vào bộ nhớ đệm hết hạn trong bộ nhớ đệm của trình chạy dịch vụ (> 30 ngày): Trình chạy dịch vụ sẽ truy cập mạng để tìm tài nguyên. Trình duyệt không có bản sao của tài nguyên trong bộ nhớ đệm HTTP nên trình duyệt sẽ chuyển sang phía máy chủ.
Ưu và nhược điểm:
- Ưu điểm: Người dùng trải nghiệm phản hồi tức thì khi trình chạy dịch vụ trả về ngay các tài nguyên đã lưu vào bộ nhớ đệm.
- Pro: Trình chạy dịch vụ có thể đảm bảo rằng yêu cầu tiếp theo cho một URL nhất định sử dụng phản hồi mới từ mạng, nhờ việc xác thực lại diễn ra "trong nền".
- Nhược điểm: Cần có chiến lược lưu vào bộ nhớ đệm của trình chạy dịch vụ được xác định rõ ràng.
Tình huống: Lưu vào bộ nhớ đệm trong thời gian ngắn (Mạng trở lại bộ nhớ đệm)
- Khi một tài nguyên đã lưu vào bộ nhớ đệm hợp lệ trong bộ nhớ đệm của trình chạy dịch vụ (<= 1 ngày): Trình chạy dịch vụ sẽ truy cập mạng để tìm tài nguyên. Trình duyệt sẽ trả về tài nguyên từ bộ nhớ đệm HTTP nếu có. Nếu mạng ngừng hoạt động, trình chạy dịch vụ sẽ trả về tài nguyên từ bộ nhớ đệm của trình chạy dịch vụ
- Khi một tài nguyên đã lưu vào bộ nhớ đệm hết hạn trong bộ nhớ đệm của trình chạy dịch vụ (> 1 ngày): Worker này sẽ truy cập vào mạng để tìm nạp tài nguyên. Trình duyệt tìm nạp các tài nguyên qua mạng vì phiên bản lưu trong bộ nhớ đệm HTTP đã hết hạn.
Ưu và nhược điểm:
- Ưu điểm: Khi mạng không ổn định hoặc ngừng hoạt động, trình chạy dịch vụ sẽ ngay lập tức trả về các tài nguyên đã lưu vào bộ nhớ đệm.
- Nhược điểm: Trình chạy dịch vụ đòi hỏi thêm tính năng chặn truy xuất bộ nhớ đệm để ghi đè Bộ nhớ đệm HTTP và thực hiện các yêu cầu "Mạng trước".
Kết luận
Do sự phức tạp của việc kết hợp các tình huống lưu vào bộ nhớ đệm, nên không thể thiết kế một quy tắc cho mọi trường hợp. Tuy nhiên, dựa trên những phát hiện trong các phần trước, có một vài đề xuất cần xem xét khi thiết kế chiến lược bộ nhớ đệm:
- Logic lưu vào bộ nhớ đệm của trình chạy dịch vụ không cần phải nhất quán với logic hết hạn lưu vào bộ nhớ đệm HTTP. Nếu có thể, hãy sử dụng logic hết hạn lâu hơn trong trình chạy dịch vụ để cấp cho trình chạy dịch vụ nhiều quyền kiểm soát hơn.
- Việc lưu vào bộ nhớ đệm của HTTP vẫn đóng vai trò quan trọng nhưng không đáng tin cậy khi mạng không ổn định hoặc ngừng hoạt động.
- Xem lại các chiến lược lưu vào bộ nhớ đệm của từng tài nguyên để đảm bảo chiến lược lưu vào bộ nhớ đệm của trình chạy dịch vụ cung cấp giá trị mà không xung đột với bộ nhớ đệm HTTP.