Cải thiện tính năng phát hiện hỗ trợ ngoại tuyến của Ứng dụng web tiến bộ

Penny McLachlan
Penny McLachlan

Ứng dụng web tiến bộ (PWA) là một mô hình để xây dựng các ứng dụng hiện đại, có thể cài đặt bằng công nghệ web dành cho thiết bị di động và máy tính.

Một trong những tiêu chí để xây dựng trải nghiệm web hiện đại (không phải PWA) là ứng dụng phải tiếp tục hoạt động ngay cả khi thiết bị không có kết nối mạng. Điều đó có nghĩa là sẽ không có màn hình khủng long trên Chrome nếu người dùng mất quyền truy cập mạng trên thiết bị của họ!

Mục tiêu của tất cả các tiêu chí về PWA là giúp đảm bảo người dùng có trải nghiệm chất lượng cao, có thể cạnh tranh với ứng dụng khi duyệt web. Chrome sẽ kiểm tra theo tiêu chí PWA trước khi bật chức năng cài đặt cho PWA.

Chỉ những ứng dụng đáp ứng tất cả các tiêu chí cốt lõi về khả năng cài đặt Ứng dụng web tiến bộ (bao gồm cả việc hỗ trợ chế độ ngoại tuyến) mới có thể được cài đặt vào thiết bị qua Chrome.

Logic phát hiện ngoại tuyến trước đó

Việc xác minh khả năng hỗ trợ ngoại tuyến đã là một phần của tiêu chí về khả năng cài đặt PWA trong vài năm qua. Cho đến gần đây, Chrome không thể mô phỏng các yêu cầu thông qua trình chạy dịch vụ, do đó, không thể kiểm tra toàn bộ hành vi ngoại tuyến chính xác.

Sơ đồ của trình chạy dịch vụ

Điều đó có nghĩa là Chrome không thể xác thực liệu trình xử lý sự kiện fetch có trả về tài nguyên hợp lệ bằng HTTP 200 trong quá trình kiểm tra ngoại tuyến hay không. Chrome chỉ kiểm tra xem trình chạy dịch vụ có thực sự có trình xử lý fetch hay không.

Đã cập nhật logic phát hiện ngoại tuyến

Chrome 89 đã thêm tính năng chạy các yêu cầu ngoại tuyến được mô phỏng thông qua trình chạy dịch vụ, cho phép cải tiến logic phát hiện ngoại tuyến để phản ánh tốt hơn khả năng hỗ trợ ngoại tuyến thực tế của ứng dụng.

Chúng tôi đã lên kế hoạch sử dụng tính năng mới này để đảm bảo rằng PWA cung cấp một trang hợp lệ khi không có mạng, nhưng các gói đó đã bị tạm ngưng. Quy trình kiểm tra khả năng cài đặt sẽ tiếp tục đạt nếu trang có một trình chạy dịch vụ chứa trình xử lý sự kiện fetch.

Ảnh hưởng của việc này đối với nhà phát triển

Mặc dù hiện không cần thay đổi gì, nhưng bạn nên cung cấp trải nghiệm ngoại tuyến, vì chúng tôi dự kiến sẽ sử dụng logic mới cập nhật để kiểm tra trang hợp lệ vào thời điểm nào đó trong tương lai.

Bạn là người quyết định loại trải nghiệm ngoại tuyến mà mình muốn cung cấp. Một mặt là trải nghiệm ngoại tuyến với đầy đủ chức năng. Điều này có nghĩa là lưu trước tất cả tài nguyên và dữ liệu cần thiết vào bộ nhớ đệm, đồng thời đồng bộ hoá dữ liệu với máy chủ của bạn khi người dùng có kết nối mạng trở lại. Việc lưu vào bộ nhớ đệm các tài nguyên cũng sẽ giúp cải thiện các chỉ số quan trọng về trang web vì tính năng này giúp bạn không cần tải tài nguyên xuống từ mạng mỗi lần lưu. Phía bên kia là một trang dự phòng ngoại tuyến tuỳ chỉnh.

Cảnh báo xuất hiện trong thẻ Vấn đề của công cụ cho nhà phát triển sẽ bị xoá trên phiên bản Chrome 90.