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ẫu dành cho 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à thiết bị máy tính để bàn.

Một trong những tiêu chí để xây dựng trải nghiệm web hiện đại là không PWA trùng khớp là ứng dụng phải tiếp tục hoạt động ngay cả khi thiết bị đang ngoại tuyến. Đ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 mạng trên thiết bị của họ!

Mục tiêu của tất cả tiêu chí PWA là giúp đảm bảo người dùng có chất lượng, trải nghiệm cạnh tranh trong ứng dụng khi duyệt web. Chrome hoạt động hiệu quả kiểm tra theo tiêu chí PWA trước khi bật cài đặt cho PWA.

Chỉ những ứng dụng đáp ứng toàn bộ yêu cầu cốt lõi Tiêu chí về khả năng cài đặt Ứng dụng web tiến bộ, bao gồm cả dịch vụ hỗ trợ cho chế độ ngoại tuyến, có thể được cài đặt từ Chrome vào thiết bị.

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

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

Sơ đồ về trình chạy dịch vụ

Điều đó có nghĩa là Chrome không thể xác thực liệu fetch trình xử lý sự kiện đã trả về một tài nguyên hợp lệ có HTTP 200 trong quá trình kiểm tra ngoại tuyến. 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 khả năng chạy các yêu cầu ngoại tuyến được mô phỏng thông qua Service worker, cho phép logic phát hiện ngoại tuyến được cải thiện để phản ánh tốt hơn hỗ trợ ngoại tuyến thực sự 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 các PWA cung cấp một khi không có kết nối mạng nhưng vẫn đặt các gói đó. Kiểm tra khả năng cài đặt sẽ tiếp tục chuyển nếu trang đó có một trình chạy dịch vụ bao gồm Trình xử lý sự kiện fetch.

Ảnh hưởng đối với nhà phát triển

Mặc dù hiện không cần thay đổi gì, nhưng bạn vẫ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 đã cập nhật để kiểm tra xem tại một thời điểm nào đó trong tương lai.

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

Cảnh báo được hiển thị trong phần Thẻ Vấn đề của các công cụ cho nhà phát triển sẽ bị xoá vào khoảng Chrome 90.