Categories Trình duyệt

Trình duyệt Chrome thay đổi cách cache tài nguyên bên thứ ba, điều đó có thể làm chậm tốc độ website của bạn

Một lợi thế truyền thống của việc tải web font từ Google Fonts đó là bạn sẽ nhận được lợi ích tiềm năng từ chuyện nó đã được cache sẵn rồi trong trình duyệt của người dùng từ các trang web khác mà người dùng từng ghé thăm trước đây. Ý tưởng vẫn vậy cho bất kỳ nguồn tài nguyên nào tải theo phương thức tập trung, các dịch vụ như CDNjs.com hay JSdelivr nổi lên chính vì lý do này.

Trình duyệt phổ biến nhất thế giới Chrome sẽ sớm thay đổi điều đó (mức độ phổ biến của Chrome cao hơn nhiều các vị trí tiếp theo, có thể bạn sẽ bất ngờ khi biết trình duyệt nào đang ở vị trí số 2). Tài liệu tham khảo quan trọng cho thay đổi này bạn đọc ở đây: https://chromestatus.com/feature/5730772021411840 – Phân vùng HTTP cache.

Dưới đây là tóm tắt (chú thích của người dịch: đoạn này nhiều thuật ngữ chuyên môn nên bản thân tôi khó dịch mà bạn đọc chắc hẳn cũng thấy khó hiểu. Đừng lo, bạn cứ nắm lấy ý tưởng chính là được, các phần sau sẽ giải thích rõ ràng hơn):

HTTP cache hiện chỉ có một không gian tên duy nhất (single namespace) cho mỗi profile, namespace này chung cho tất cả các nguồn và nguồn phụ bất kể nguồn gốc hoặc quá trình kết xuất.

Phân chia cache dựa trên nguồn gốc giúp trình duyệt làm chệch hướng tấn công kiểu side-chanel khi một trang có thể phát hiện các tài nguyên trong cache của trang khác.


Điều đó có nghĩa là gì?

Trước hết là tình hình hiện tại khi Chrome chưa thực hiện phân vùng HTTP cache, dưới đây là ví dụ đơn giản minh họa điều đang diễn ra:

  1. Khi máy khách A ghé thăm website1, nó cần tải về jQuery từ địa chỉ https://code.jquery.com/jquery-3.4.1.min.js;
  2. Trình duyệt tải về file jQuery đầy đủ từ địa chỉ: https://code.jquery.com/jquery-3.4.1.min.js;
  3. Máy khách A tiếp tục ghé thăm website2, nó cũng cần tải jQuery từ https://code.jquery.com/jquery-3.4.1.min.js;
  4. Trình duyệt đã có cache cho tài nguyên jQuery này (do người dùng đã tải khi truy cập website1), nghĩa là nó không cần tải jQuery từ code.jquery.com nữa, bởi vì nó đã có sẵn trong bộ nhớ cache cục bộ trên thiết bị người dùng rồi.

Tuy nhiên, sau khi thay đổi được áp dụng, những ai ghé thăm website2 sẽ không có cache nữa! Nó sẽ phải tải lại toàn bộ tài nguyên từ code.jquery.com.

Điều này có khả năng gây ảnh hưởng lớn (theo cách tiêu cực) đến hiệu suất, vậy tại sao Chrome lại thực hiện thay đổi này?

Vâng, hóa ra các chi tiết về cache có thể dẫn đến rò rỉ thông tin. Để hiểu điều này rõ hơn, tôi sử dụng lại ví dụ ở trên: website2 có thể phát hiện ra được rằng người dùng vừa ghé thăm website1 trước đó. Điều đấy có nghĩa là các trang web có thể sử dụng điều này để theo dõi các hoạt động trên thế giới web của bạn. Vâng, điều này có nghĩa là tính riêng tư của bạn đang gặp nguy hiểm (nếu bạn đọc lưu ý thì có thể thấy vấn đề quyền riêng tư trở thành tranh cãi chính trong khoảng vài năm trở lại đây đối với các công ty công nghệ lớn từ Google, Facebook, Apple. Người dùng giờ không chỉ quan tâm đến công nghệ tốt đến đâu, họ còn chú ý đến quyền riêng tư của họ được bảo vệ đến mức độ nào. Facebook là một điển hình điêu đứng vì vi phạm quyền riêng tư).

Nếu bạn kiểm tra https://chromestatus.com/feature/5730772021411840 bạn sẽ lưu ý điều này được đánh dấu là một vấn đề về bảo mật.


Các ngụ ý

Ảnh hưởng lớn nhất là việc tải các tài nguyên phổ biến từ cùng một nguồn (ví dụ Google Fonts, jQuery, vân vân) sẽ ít đi, bởi vì niềm tin của bạn rằng tài nguyên có khả năng được cache sẵn cũng không còn nữa.

Với sự ra đời của HTTP/2, tôi thường ủng hộ việc tự host các nguồn tài nguyên hơn (chẳng hạn như web fonts), lý do là vì cái giá phải trả khi thực hiện kết nối HTTP mới, thậm chí ngay cả với các dịch vụ CDN lớn như Google: bạn thường sẽ mất nhiều thời gian hơn so với việc thực hiện yêu cầu khác trên một kết nối hiện có. Đừng quên rằng các kết nối mới này có thể bổ sung thời gian cho tìm kiếm DNS, TCP và HTTPS (dù bạn có thể khắc phục điều này phần nào nhờ preconnect).

Trong tương lai không xa, điều này sẽ trở thành thực tế mà chúng ta phải đối phó.


Các trình duyệt khác thì sao?

Chrome không phải là trình duyệt duy nhất đi theo hướng này. Bạn có thể không thấy ngạc nhiên khi biết rằng Safari đã làm điều này nhiều năm rồi. FireFox cũng đang xem xét thực hiện điều đó.

(Dịch từ bài viết: Prepare For Fewer Cache Hits As Chrome Partitions Their HTTP Cache, tác giả: Joseph Scott)

Vài lời của người dịch: Trong bài viết về 21 cách tăng tốc WordPress tôi có đề cập đến việc sử dụng nguồn tập trung của bên thứ ba để host các tài nguyên phổ biến như là một cách để cải thiện tốc độ, và ví nó với chuyện bạn nên đến công viên công cộng, thay vì tự xây khu vườn cây xanh thật bự trong nhà. Nhưng với thay đổi này của Chrome, lợi ích tốc độ sẽ không còn, điều còn lại chỉ là lợi ích giảm tải, vốn chẳng phải là vấn đề lớn với những ai không quá khó khăn về chi phí…Khi có COVID-19 bạn tập thể dục trong nhà, vì ra công viên lúc này thật nguy hiểm!

Back to Top