Tìm hiểu về Browser Cache

Tìm hiểu về Browser Cache

Ở bài viết này chúng ta sẽ đề cập đến Browser Cache, có thể nhiều bạn không mấy xa lạ nghe đến thuật ngữ này đặc biệt những web developer và cả người dùng web. Vậy hãy cùng mình tìm hiểu ở bài viết này nhé ! Bắt đầu ngay thôi nào ….

Nói đến browser cache thì nó liên quan đến mảng lập trình web thế nên nhiều bạn không theo mảng web hoặc những ai không phải dân lập trình thì thường sẽ bỏ qua đến khải niệm này. Và trong bài này mình sẽ giải thích 1 cách đơn giản nhất mà những bạn nào không phải dân lập trình cũng có thể hiểu được.

Để biết được khái niệm này thì chúng ta cần phải biết một chút kiến thức về web. Đặc biệt là mô hình server – client. Trong bài viết trước thì mình cũng đã chia sẻ cho các bạn về mô hình client – server này rồi. Nếu các bạn chưa biết hoặc chưa đọc bài viết đấy thì có thể tham khảo tại đây.

Browser Caching là gì?

Khi người dùng sử dụng trình duyệt trên máy tính để truy cập vào 1 trang web bất kỳ, trình duyệt sẽ tải các thành phần dữ liệu từ trên web server xuống như hình ảnh,font chữ, file text…. và kết hợp các thành phần này thành giao diện trang web hoàn chỉnh hiển thị trên trình duyệt. Các thành phần dữ liệu đó sẽ được lưu tạm thời vào bộ nhớ đệm trên trình duyệt. Và đó là bộ nhớ đệm (Cache).

Browser caching (dịch ra tiếng Việt: Bộ nhớ đệm của trình duyệt) là 1 vùng lưu trữ dữ liệu trên ổ cứng hoặc trên RAM của máy tính, dùng để lưu trữ tạm thời dữ liệu được trình duyệt tải về.

Các dữ liệu sẽ được lưu tại bộ nhớ đệm này thường là các file hình ảnh, file html, file css, file javascript, tùy thuộc vào webserver chỉ định sẽ lưu loại nào trên cache. Và các dữ liệu tạm thời này sẽ tồn tại trong một thời gian ngắn được chỉ định, sau thời gian chỉ định thì dữ liệu đó sẽ được xóa hoặc làm mới, cập nhật lại.

Tìm hiểu về Browser Cache

Từ lần truy cập sau vào trang web thì trình duyệt sẽ kiểm tra bộ nhớ đệm trước. Nếu trong cache các file đã có thì trình duyệt sẽ lấy các file đó trong bộ nhớ đệm, thay vì phải tải lại các file đã định dạng từ trên server xuống. Nếu các file không tồn tại trong bộ nhớ đệm (cache) thì trình duyệt sẽ gửi request lên web server để  tải về.

Hiểu đơn giản là như bạn mua 1 món đồ dùng mà bạn sử dụng còn thừa thì bạn sẽ cất vào trong tủ thay vì vứt đi. Đến lúc bạn cần sử dụng đến món đồ đấy thì bạn chỉ cần lấy đồ trong tủ mà sử dụng thay vì đỡ phải mất thời gian và tiền bạc chạy ra ngoài tiệm mua.

Tầm ảnh hưởng của Browser Cache và Website như thế nào?

Như ví dụ trên thì có phải các bạn đã tiết kiệm được thời gian và chi phí khi sử dụng 1 món đồ đúng không nào. Thì ở trên website cũng vậy, Bộ nhớ đệm sẽ giúp cho trình duyệt tải website nhanh hơn và tiết kiệm thời gian cho người dùng web. 

Lý do để browser cache giúp website tải nhanh hơn:

1. Bộ nhớ đệm trình duyệt giúp giảm tải cho máy chủ, giúp máy chủ phục vụ được nhiều yêu cầu khác, các yêu cầu được xử lý nhanh hơn vì giảm thời gian chờ.

   Với các dữ liệu được lưu trên bộ nhớ đệm, khi người dùng truy cập vào trang web, trình duyệt sẽ lấy từ bộ nhớ đệm ra, thay vì gửi yêu cầu lên webserver, chờ server xử lý và gửi kết quả về. 

2. Tải dữ liệu từ bộ nhớ đệm trình duyệt sẽ nhanh hơn tải từ máy chủ nên thời gian tải trang web sẽ giảm, giúp website nhanh hơn.

3. Giảm dung lượng dữ liệu truyền tải từ server về máy người dùng do 1 phần dữ liệu đã được lưu trữ sẵn trong máy. Điều này sẽ giúp giảm thời gian tải trang web. Việc giảm dung lượng truyền tải này còn đặc biệt có ý nghĩa trong bài toán tối ưu băng thông, tối ưu chi phí truyền tải.

Các loại Bộ nhớ đệm (Browser Cache)

Tìm hiểu về Browser Cache

Như các bạn đã biết thì bộ nhớ đệm của trình duyệt có 2 loại:

  • Private Cache (Bộ nhớ đệm riêng tư) dành riêng cho một người dùng. Bạn có thể đã thấy “bộ nhớ đệm” trong cài đặt trình duyệt của mình. Bộ nhớ cache của trình duyệt lưu giữ tất cả các tài liệu được người dùng tải xuống qua HTTP. Bộ nhớ đệm này được sử dụng để cung cấp các tài liệu đã truy cập để điều hướng lùi/chuyển tiếp, lưu, xem dưới dạng nguồn, v.v. mà không yêu cầu thêm một chuyến đi tới máy chủ. Nó cũng cải thiện khả năng duyệt ngoại tuyến các nội dung được lưu trong bộ nhớ cache.
  • Shared cache (Bộ nhớ đệm chia sẻ) là bộ đệm lưu trữ các phản hồi để nhiều người dùng sử dụng lại.

Ví dụ: một công ty của bạn có thể đã thiết lập proxy web như một phần của cơ sở hạ tầng mạng cục bộ để phục vụ nhiều người dùng để các tài nguyên phổ biến được sử dụng lại một số lần, giảm lưu lượng mạng và độ trễ.

Tạm Kết

Như vậy mình đã chia sẻ cho các bạn về Browser Cache (Browser Caching). Hy vọng qua bài viết này các bạn hiểu về browser cache cho những bạn web developer và cả người dùng web.

Xin cảm ơn các bạn đã đọc đến đây và chúc các bạn một ngày làm việc vui vẻ nha :)) Và đừng quên nhấn share và đánh giá để ủng hộ mình nhé.

Các bạn có thể tham khảo các bài viết hay về JavaScript tại đây.


Hãy tham gia nhóm Học lập trình để thảo luận thêm về các vấn đề cùng quan tâm.

CodeGym Full-stack

Leave a Reply

Your email address will not be published. Required fields are marked *