Việc triển khai trình chạy dịch vụ có thể thay đổi hành vi của trang web theo những cách ngoài dự kiến. Vì Workbox giúp bạn dễ dàng viết và triển khai một trình chạy dịch vụ, nên bạn có thể dễ dàng bỏ qua một số tác động mà một trình chạy dịch vụ có trên trang web sau khi được triển khai.
Điều này không có nghĩa là việc sử dụng Workbox sẽ dẫn đến kết quả xấu, mà chỉ là sự tiện lợi mà Workbox mang lại có thể giúp bạn dễ dàng gặp phải một số sai lầm nếu không nhận biết được những gì đi kèm với việc triển khai một trình chạy dịch vụ.
Dẫn ra những cạm bẫy
Trước đây, chúng ta đã đề cập đến Khả năng lưu vào bộ nhớ đệm trong các tài liệu này nhưng chưa trình bày đầy đủ về cách phương pháp này có thể phản tác dụng. Bạn có thể gặp sự cố nếu áp dụng tính năng lưu vào bộ nhớ đệm cho quá nhiều thành phần hoặc nếu trình chạy dịch vụ được đăng ký trước khi trang có cơ hội tải xong các thành phần quan trọng.
Vì hành vi mặc định của workbox-webpack-plugin là hướng dẫn trình chạy dịch vụ tự động tạo trước các thành phần được tạo vào bộ nhớ đệm, nên điều này có thể rắc rối theo cách dễ bỏ qua vì rào cản để áp dụng là thấp.
workbox-webpack-plugin.
Trong ví dụ này, hệ thống sẽ lưu trước 14 tài sản trong dự án hiện tại vào bộ nhớ đệm, với tổng số là 352 kilobyte theo mặc định.Khi một trình chạy dịch vụ lưu trước các tài sản vào bộ nhớ đệm trong quá trình cài đặt, một hoặc nhiều yêu cầu mạng sẽ kích hoạt cùng lúc. Điều này có thể gây ra vấn đề cho trải nghiệm người dùng nếu không đúng thời điểm. Ngay cả khi có thời gian hợp lý, thiết bị vẫn có thể lãng phí dữ liệu nếu lượng tài sản được lưu trước vào bộ nhớ đệm không bị giới hạn.
Tất cả nằm ở thời gian
Nếu một trình chạy dịch vụ lưu trước bất kỳ nội dung nào vào bộ nhớ đệm thì thời gian đăng ký của nó sẽ rất quan trọng.
Trình chạy dịch vụ thường được đăng ký bằng các phần tử <script> cùng dòng.
Điều này có nghĩa là các trình phân tích cú pháp HTML có thể phát hiện mã đăng ký của trình chạy dịch vụ trước khi các thành phần quan trọng của trang được tải.
Đây là một vấn đề. Trong trường hợp xấu nhất, trình chạy dịch vụ nên trung lập về hiệu suất, chứ không làm giảm hiệu suất. Có lợi cho người dùng và đăng ký trình chạy dịch vụ khi sự kiện load của trang kích hoạt.
Điều này làm giảm khả năng lưu vào bộ nhớ đệm sẽ ảnh hưởng đến việc tải các tài sản quan trọng trên trang, từ đó trang có thể tương tác nhanh hơn mà không phải thực hiện các yêu cầu mạng cho những tài sản có thể không cần thiết cho đến sau này.
Thận trọng khi sử dụng dữ liệu
Bất kể thời điểm nào, tính năng lưu vào bộ nhớ đệm cũng có liên quan đến việc gửi các yêu cầu mạng. Nếu một tệp kê khai của tài sản để lưu trước vào bộ nhớ đệm không được tuyển chọn kỹ lưỡng, thì có thể một số kết quả bị lãng phí.
Dữ liệu bị lãng phí có thể là một sự đánh đổi tiềm ẩn của việc lưu trước dữ liệu, nhưng không phải ai cũng có quyền truy cập vào Internet tốc độ cao hoặc thậm chí là các gói dữ liệu không giới hạn! Khi lưu vào bộ nhớ đệm, hãy cân nhắc việc loại bỏ những thành phần đặc biệt lớn và dựa vào tính năng lưu vào bộ nhớ đệm trong thời gian chạy để thu thập chúng thay vì đưa ra những giả định tốn kém.
Quá trình khởi động của trình chạy dịch vụ có thể trì hoãn các yêu cầu mạng
Service worker chạy trong một quy trình riêng biệt với phần còn lại của mã của trang web. Quá trình này bắt đầu và dừng thường xuyên. Khi một trình chạy dịch vụ cần xử lý một sự kiện tìm nạp sau khi không hoạt động, trước tiên, trình duyệt cần dành thời gian để khởi động trình chạy dịch vụ này. Chi phí phát sinh trước khi có thể xử lý yêu cầu là nhỏ so với lợi ích của việc phân phát phản hồi từ bộ nhớ đệm thay vì mạng.
Khi sử dụng các chiến lược không thể phân phát từ bộ nhớ đệm và phải truy cập vào mạng (cụ thể là khi xử lý các yêu cầu điều hướng), thời gian khởi động luôn tăng thêm độ trễ. Tuỳ thuộc vào chức năng của thiết bị và/hoặc áp lực của CPU, yêu cầu điều hướng có thể bị trễ đáng kể do khởi động trình chạy dịch vụ chậm. Việc triển khai một trình chạy dịch vụ mà không biết về độ trễ này có nghĩa là người dùng có thể gặp phải vấn đề về hiệu suất ngoài ý muốn.
Vấn đề này đã được giải quyết bằng tính năng Tải trước điều hướng, nhưng tất cả trình duyệt chưa hỗ trợ tính năng này. Tuy nhiên, bạn nên cân nhắc cách sử dụng và sẽ đề cập đến cách này ở phần sau của tài liệu này.
Chiến lược ưu tiên bộ nhớ đệm có thể tác động ngược
Các chiến lược lưu vào bộ nhớ đệm tham khảo bộ nhớ đệm trước – hoặc chỉ tham khảo bộ nhớ đệm – đều rất phù hợp cho cả quyền truy cập và hiệu suất khi không có mạng. Tuy nhiên, chúng có xu hướng gây ra sự cố trong một số trường hợp cụ thể.
Lưu các tài sản tĩnh không được phiên bản vào bộ nhớ đệm trong thời gian chạy
Các gói thường tạo phiên bản thành phần tĩnh với hàm băm dựa trên nội dung trong tên tệp (ví dụ: styles.a4edf38c.css). Trong những trình chạy dịch vụ sử dụng chiến lược lưu vào bộ nhớ đệm trước tiên sẽ tham khảo ý kiến của bộ nhớ đệm cho thành phần tĩnh và sử dụng chiến lược ưu tiên mạng để đánh dấu trang, thì sẽ không gặp vấn đề khi lưu vào bộ nhớ đệm vì các thành phần đã cập nhật được tham chiếu trong mã đánh dấu luôn được truy xuất từ mạng.
Các vấn đề phát sinh trong các tình huống khi nội dung tĩnh không được phiên bản được lưu vào bộ nhớ đệm trong thời gian chạy bằng các chiến lược này.
Nếu chức năng của trang web do app.js cung cấp và sử dụng chiến lược thời gian chạy ưu tiên bộ nhớ đệm, thì sau đó app.js sẽ được cập nhật mà không thay đổi tên tệp, thì phiên bản lưu vào bộ nhớ đệm ban đầu sẽ tiếp tục được phân phát từ bộ nhớ đệm thay vì được cập nhật.
Giải pháp cho yêu cầu này là sử dụng một chiến lược tham khảo mạng để cập nhật, chẳng hạn như ưu tiên mạng hoặc lỗi thời trong khi xác thực lại. Ngoài ra, các công cụ xây dựng có thể tạo một tệp kê khai trước khi lưu vào bộ nhớ đệm cho các tài sản đó, vì logic lưu trước vào bộ nhớ đệm của Workbox sẽ giúp những tài sản này luôn được cập nhật.
Tuy nhiên, bạn nên cân nhắc việc tạo phiên bản cho các thành phần tĩnh, cho dù bằng hàm băm trong tên thành phần hay chuỗi truy vấn. Điều này sẽ giúp tránh các vấn đề về thành phần cũ trong trình chạy dịch vụ sử dụng chiến lược thời gian chạy ưu tiên bộ nhớ đệm cho các thành phần tĩnh.
Hạn mức bộ nhớ của bộ nhớ
Thỉnh thoảng, bạn nên triển khai các bản cập nhật của trình chạy dịch vụ và khi bản cập nhật được ra mắt, các bộ nhớ đệm cũ có tên đã hết hạn thường sẽ được lược bớt trong quá trình kích hoạt trình chạy dịch vụ mới.
Tuy nhiên, một số vòng lặp của trình chạy dịch vụ tồn tại lâu dài hoặc tên bộ nhớ đệm có thể không được cập nhật trong các bản cập nhật mới. Khi điều này xảy ra, các thành phần tĩnh cũ có thể chất đầy lên bộ nhớ đệm khi các bản cập nhật cho chúng được triển khai. Các trình duyệt đặt hạn mức bộ nhớ và giới hạn có thể khác nhau. Đó là lý do bạn nên lưu ý đến những đề xuất này!
Workbox làm tốt việc giảm thiểu những vấn đề này, nhưng bạn vẫn có thể vượt quá hạn mức bộ nhớ. Bạn có thể kiểm soát bộ nhớ đệm tốt hơn bằng mô-đun hết hạn hộp làm việc.
Không sợ hãi
Việc triển khai một trình chạy dịch vụ không phải là chuyện nhỏ. Tuy nhiên, việc triển khai một nhân viên dịch vụ với Workbox sẽ không phải là một việc đáng sợ nếu phải lập kế hoạch và lưu tâm một chút. Khi tiếp tục, tài liệu này sẽ giúp bạn xử lý những mối lo ngại này một cách cẩn trọng và tự tin.