Lưu vào bộ nhớ đệm của trình chạy dịch vụ và lưu HTTP vào bộ nhớ đệm

Ư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, việc lưu tài nguyên vào bộ nhớ đệm đã trở nên phức tạp hơn bao giờ hết. Bài viết này đề cập đến bức tranh toàn cảnh về việc lưu vào bộ nhớ đệm của trình duyệt, bao gồm:

  • Các trường hợp sử dụng và sự khác biệt giữa 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 của HTTP.
  • Ưu và nhược điểm của các chiến lược hết hạn vào bộ nhớ đệm của trình chạy dịch vụ so với thông thường Chiến lược lưu vào bộ nhớ đệm của HTTP.

Tổng quan về quy trình lưu vào bộ nhớ đệm

Ở cấp độ cao, trình duyệt tuân theo thứ tự lưu vào bộ nhớ đệm dưới đây khi yêu cầu tài nguyên:

  1. Bộ nhớ đệm của trình chạy dịch vụ: Trình chạy dịch vụ sẽ kiểm tra xem tài nguyên có nằm trong bộ nhớ đệm và sẽ quyết định có trả về chính tài nguyên đó hay không dựa trên chiến lược lưu vào bộ nhớ đệm được lập trình của nó. Ghi chú rằng điều 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ừ dịch vụ bộ nhớ đệm của trình thực thi thay vì mạng.
  2. 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 HTTP và chưa hết hạn, trình duyệt sẽ tự động sử dụng từ bộ nhớ đệm HTTP.
  3. Phía máy chủ: Nếu không tìm thấy nội dung gì trong bộ nhớ đệm của trình chạy dịch vụ hoặc bộ nhớ đệm HTTP, trình duyệt truy cập 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, yêu cầu phải quay lại máy chủ gốc.

Luồng lưu vào bộ nhớ đệm

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ụ 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ề cho trình duyệt. Bộ nhớ đệm của trình chạy dịch vụ và HTTP bộ nhớ đệm phục vụ cùng mục đích chung, nhưng bộ nhớ đệm của trình chạy dịch vụ mang lại nhiều khả năng lưu vào bộ nhớ đệm hơn, chẳng hạn như kiểm soát chi tiết chính xác nội dung được lưu vào bộ nhớ đệm và cách thực hiện việc lưu vào bộ nhớ đệm.

Kiểm soát bộ nhớ đệm của trình chạy dịch vụ

Một trình chạy dịch vụ chặn các yêu cầu HTTP bằng event trình nghe (thường là sự kiện fetch). Chiến dịch này đoạn mã minh hoạ logic của một Ưu tiên bộ nhớ đệm lưu vào bộ nhớ đệm.

Sơ đồ cho thấy cách trình chạy dịch vụ chặn các yêu cầu HTTP

Bạn nên sử dụng Hộp công việc để tránh phát minh lạ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 của trình chạy dịch vụ phổ biến và thời điểm mỗi chiến lược hữu ích.

Chiến lược Lý do về tính mới mẻ Trường hợp sử dụng
Mạng chỉ Nội dung phải luôn được cập nhật.
  • Thanh toán và xác nhận mua hàng
  • Bảng sao kê số dư
Mạng quay lại 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, có thể chấp nhận được để phân phát nội dung hơi cũ.
  • Dữ liệu kịp thời
  • Giá và mức giá (yêu cầu tuyên bố từ chối trách nhiệm)
  • Trạng thái đơn đặt hàng
Lỗi thời trong khi xác thực lại Bạn có thể phân phát ngay nội dung đã lưu vào bộ nhớ đệm, nhưng nên sử dụng nội dung đã cập nhật trong bộ nhớ đệm tương lai.
  • Nguồn cấp dữ liệu tin tức
  • Trang thông tin sản phẩm
  • Tin nhắn
Bộ nhớ đệm trước, quay lại mạng Nội dung này 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 Service worker đôi khi sẽ kiểm tra các bản cập nhật.
  • Giao diện ứng dụng
  • Tài nguyên chung
Chỉ bộ nhớ đệm Nội dung hiếm khi thay đổi.
  • Nội dung tĩnh

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 khả năng kiểm soát chi tiết logic lưu vào bộ nhớ đệm, việc lưu vào bộ nhớ đệm của trình chạy dịch vụ cũng cung cấp:

  • Thêm bộ nhớ và dung lượng lưu trữ cho máy chủ gốc: Trình duyệt phân bổ bộ nhớ đệm HTTP tài nguyên theo từng nguồn gốc. Trong phạm vi khác nếu bạn có nhiều miền con, thì tất cả chúng sẽ chia sẻ cùng một bộ nhớ đệm HTTP. Không có đảm bảo rằng nội dung của nguồn gốc/miền của bạn được lưu trong bộ nhớ đệm HTTP trong thời gian dài. Cho Ví dụ: người dùng có thể xoá hoàn toàn bộ nhớ đệm bằng cách dọn dẹp thủ công trong giao diện người dùng cài đặt của trình duyệt, hoặc kích hoạt quá trình 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ụ, bạn có khả năng nội dung được lưu vào bộ nhớ đệm của bạn sẽ được lưu vào bộ nhớ đệm. Xem phần Ổn định để 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. Có chức 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 "vấn đề" nhỏ dễ dàng hơn nhiều (với chiến lược "cũ trong khi xác thực lại"), cung cấp trải nghiệm ngoại tuyến trọn vẹn (với chiến lược "Chỉ bộ nhớ đệm") hoặc thậm chí là trải nghiệm ngoại tuyến giữa các 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ý phát hiện") khi thích hợp.

Lưu vào bộ nhớ đệm của HTTP

Lần đầu tiên một trình duyệt tải một trang web và các tài nguyên có 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 các trình duyệt bật tự động, trừ phi bộ nhớ đệm này bị người dùng cuối vô hiệu hoá một cách rõ ràng.

Việc sử dụng bộ nhớ đệm HTTP có nghĩa là dựa vào máy chủ để xác định thời điểm cần lưu một tài nguyên vào bộ nhớ đệm và lâu hơn.

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 máy chủ phản hồi yêu cầu của trình duyệt về tài nguyên, máy chủ sử dụng tiêu đề phản hồi HTTP để cho trình duyệt biết khoảng thời gian nên lưu tài nguyên vào bộ nhớ đệm. Xem phần Tiêu đề phản hồi: định cấu hình trang web của bạn máy chủ để tìm hiểu thêm.

Các chiến lược và trường hợp sử dụng của việc lưu vào bộ nhớ đệm 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 của HTTP chỉ giải quyết logic hết hạn tài nguyên dựa trên thời gian (TTL). Xem Bạn nên sử dụng giá trị tiêu đề phản hồi nào?Nội dung tóm tắt để tìm hiểu thêm về các chiến lược lưu HTTP vào bộ nhớ đệm.

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 trình chạy dịch vụ bộ nhớ đệm và các lớp 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.

Hình ảnh trục trặc bên dưới 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à chức năng lưu vào bộ nhớ đệm của HTTP trong thực tế trên trường hợp khác nhau:

Logic hết hạn nhất quán cho tất cả các lớp bộ nhớ đệm

Để minh hoạ ưu và nhược điểm, chúng ta sẽ xem xét 3 tình huống: 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 trong thời gian trung bình 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ụ Bộ nhớ đệm, quay lại mạng Đã cũ trong khi xác thực lại Mạng khôi phục bộ nhớ đệm
Bộ nhớ đệm của trình chạy dịch vụ TTL 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 mạng)

  • Khi 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 được lưu vào bộ nhớ đệm tài nguyên ngay lập tức mà không cần truy cập 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 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, vì vậy ở phía máy chủ cho tài nguyên.

Nhược điểm: Trong trường hợp này, việc lưu vào bộ nhớ đệm của HTTP cung cấp ít giá trị hơn vì trình duyệt sẽ luôn truyền yêu cầu đến 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 trong thời gian trung bình (Đã lỗi thời trong khi xác thực lại)

  • Khi tài nguyên được lưu vào bộ nhớ đệm hợp lệ (<= 1 ngày): Trình chạy dịch vụ sẽ trả về tài nguyên được lưu vào bộ nhớ đệm tài nguyên ngay lập tức và đi tới mạng để tìm nạp tài nguyên. Trình duyệt có bản sao của tài nguyên trong bộ nhớ đệm HTTP, để trả về bản sao đó cho trình chạy dịch vụ.
  • Khi tài nguyên được lưu vào bộ nhớ đệm hết hạn (> 1 ngày): Trình chạy dịch vụ sẽ trả về tài nguyên được lưu vào bộ nhớ đệm tài nguyên ngay lập tức và đi tới 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, để tài nguyên đó đi phía máy chủ nhằm tìm nạp tài nguyên.

Nhược điểm: Trình chạy dịch vụ yêu cầu chặn truy xuất bộ nhớ đệm bổ sung để ghi đè bộ nhớ đệm HTTP trong để khai thác tối đa tính năng "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 quay lại bộ nhớ đệm)

  • Khi 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ả về mã đó cho trình chạy dịch vụ mà không cần truy cập phía máy chủ.
  • Khi tài nguyên được lưu vào bộ nhớ đệm hết hạn (> 10 phút): Trình chạy dịch vụ sẽ trả về tài nguyên đã lưu vào bộ nhớ đệm tài nguyên ngay lập tức và đi tới 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, để tài nguyên đó đi phía máy chủ nhằm 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 trong trung hạn, trình chạy dịch vụ cần 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ề các 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 bị lỗi.

Có sự khác biệt về logic hết hạn bộ nhớ đệm tại bộ nhớ đệm của trình chạy dịch vụ và các lớp HTTP

Để chứng minh ưu và nhược điểm, chúng ta sẽ xem xét lại các yếu tố dài hạn, trung hạn và ngắn hạn trong trường hợp cụ thể.

Tình huống Lưu vào bộ nhớ đệm trong thời gian dài Lưu vào bộ nhớ đệm trong thời gian trung bình 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ụ Bộ nhớ đệm, quay lại mạng Đã cũ trong khi xác thực lại Mạng khôi phục bộ nhớ đệm
Bộ nhớ đệm của trình chạy dịch vụ TTL 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 mạng)

  • Khi tài nguyên được 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): Dịch vụ worker sẽ trả về tài nguyên đã lưu vào bộ nhớ đệm ngay lập tức.
  • Khi tài nguyên được 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): Dịch vụ worker truy cập mạng để tìm nạp tài nguyên. Trình duyệt không có bản sao của trong bộ nhớ đệm HTTP, để nó nằm 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 service worker trả về tài nguyên được lưu vào bộ nhớ đệm ngay lập tức.
  • Chuyên nghiệp: 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 các 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 trong thời gian ngắn (Đã lỗi thời trong khi xác thực lại)

  • Khi tài nguyên được lưu trong bộ nhớ đệm hợp lệ trong bộ nhớ đệm của trình chạy dịch vụ (<= 30 ngày): Dịch vụ worker sẽ trả về tài nguyên đã lưu vào bộ nhớ đệm ngay lập tức.
  • Khi tài nguyên được 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): Dịch vụ worker truy cập mạng để lấy 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 của nó, để nó hướng về 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 service worker trả về tài nguyên được lưu vào bộ nhớ đệm ngay lập tức.
  • Pro: Service worker có thể đảm bảo rằng yêu cầu tiếp theo của 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 quay lại bộ nhớ đệm)

  • Khi tài nguyên được 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): Dịch vụ worker truy cập mạng để lấy tài nguyên. Trình duyệt sẽ trả về tài nguyên từ HTTP bộ nhớ đệm nếu có. Nếu mạng bị gián đoạn, 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 tài nguyên được 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): Dịch vụ worker truy cập mạng để tìm nạp tài nguyên. Trình duyệt tìm nạp tài nguyên qua mạng làm phiên bản được lưu trong bộ nhớ đệm 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 bị trục trặc, trình chạy dịch vụ sẽ trả về bộ nhớ đệm tài nguyên ngay lập tức.
  • Nhược điểm: Trình chạy dịch vụ yêu cầu chặn truy xuất bộ nhớ đệm bổ sung để ghi đè Bộ nhớ đệm HTTP và đặt "Mạng lên trước tiên" yêu cầu.

Kết luận

Do sự phức tạp của việc kết hợp các trường hợp lưu vào bộ nhớ đệm, nên không thể thiết kế một quy tắc bao gồm mọi trường hợp. Tuy nhiên, dựa trên kết quả trong các phần trước, có một vài nê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 thời hạn lưu vào bộ nhớ đệm của HTTP logic. Nếu có thể, hãy sử dụng logic hết hạn dài hơn trong trình chạy dịch vụ để cấp cho trình chạy dịch vụ này 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 đang giảm.
  • Xem lại các chiến lược lưu vào bộ nhớ đệm cho mỗi tài nguyên để đảm bảo trình chạy dịch vụ của bạn lưu vào bộ nhớ đệm chiến lược này cung cấp giá trị mà không xung đột với bộ nhớ đệm HTTP.

Tìm hiểu thêm