Sự khác nhau giữa Browser Cache và Local Storage?

[minhtuan_998]

Browser Cache và Local Storage đều là những dữ liệu được lưu ở browser, vậy chúng khác nhau như nào ?

[kisuluoibieng (Tên Gì Cũng Được)]

bạn đã tìm hiểu được gì về 2 cái đó, bạn cần so sánh cho mục đích gì?

[baoo (ㅤ)]

BROWSER CACHE

File javascript không hoạt động sau 1 thời gian trong 1 project php

Vấn đề này là do trình duyệt đã cache lại các file JS, CSS của bạn. Bạn có thể mở Dev Tools (F12, tab network) rồi F5 lại sẽ biết được file nào được lấy từ cache. Lợi ích của việc caching chắc bạn cũng biết, giúp load trang nhanh hơn, không phải tốn thời gian request lên server. Đây cũng là 1 trong những lý do nên viết JS, CSS ra file riêng biệt, để tận dụng browser cache. [image] Để xóa cache, đơn giản bạn chỉ cần nhấn CTRL+F5 thay vì F5 hay enter lại url, cách này hoạt động hầu hết các trì…

đầu tiên browser nó ktra xem trong thư mục cache có file với url cần tải chưa. Nếu chưa nó sẽ gửi request xin download bình thường. Nếu có rồi nó sẽ ktra tiếp “tuổi” của file này, nếu quá thời hạn định sẵn trước đó, vd lần đầu tiên cache thời hạn hợp lệ chỉ là 7 ngày, quá 7 ngày phải tải lại thì nó sẽ gửi request xin down bthg. Nếu còn trong thời hạn, nó sẽ gửi request với 1 header đặc biệt If-Modified-Since: {##}, server khi nhận được request nếu có enable client caching nó sẽ ktra xem file được yêu cầu được sửa đổi khi nào, nếu ko bị thay đổi trước ## thì nó sẽ gửi về response chỉ có header ko có body với status 304 là unmodified (ko thay đổi), browser nhận respone 304 này sẽ lấy file từ cache lên, ko cần down response body. Nếu bị thay đổi trước ## thì server sẽ gửi về response với header 200 ok và body là file đó, browser nhận được response 200 sẽ phải tải response body về :V

Bộ nhớ cache là gì và cách nó hoạt động?

Anhxanh cũng ko nói câu nào như câu đó nha :V còn giải thích cho trẻ 6 tuổi thì cache như là cái bàn làm việc ấy. Người lớn làm việc họ để sách/văn bản ở trên bàn cho gần dễ lấy đồ mà làm việc. Nhưng bàn ko chứa hết, họ lại để văn bản ở kệ sách trong phòng. Nhưng kệ sách cũng ko chứa hết, họ phải để thêm sách ở phòng khác. Nhưng phòng khác cũng ko chứa hết, họ phải để ở kho công ty. v.v… Cache là bộ nhớ tạm thời, truy cập nó rất nhanh, nhưng dung lượng của nó nhỏ nên cần phải có những bộ nhớ …

• Các file HTML, code JS được cache trên browser của cậu. Điều này giúp browser không phải download toàn bộ resource đó về máy again and again.
• HTML static, images resource… được cache trên CDN. Điều này giúp cho browser không phải chờ web server trả về các resource này, khi web server ở rất xa browser của cậu so với CDN.

Tăng tốc website bằng Caching

Vì cậu đã biết lý thuyết, tớ chỉ đưa ra ví dụ thôi nhé! Front-end Các file HTML, code JS được cache trên browser của cậu. Điều này giúp browser không phải download toàn bộ resource đó về máy again and again. HTML static, images resource… được cache trên CDN. Điều này giúp cho browser không phải chờ web server trả về các resource này, khi web server ở rất xa browser của cậu so với CDN. Lưu cookie cũng là một dạng cache, khi cậu không cần phải xác thực ở tất cả các bước trong một session. Bac…

Load ảnh trong trình duyệt web

Banh dùng thử tool này mở xem vị trí img được cache trong browser https://www.nirsoft.net/utils/image_cache_viewer.html

Thường localStorage sẽ so sánh với cookie, SessionStorage mới hợp lý. Chứ browser cache không liên quan.

Server gửi data xuống client thì nên lưu ở cookie hay localstorage?

Em thường lưu data ở cookie và cả localStorage, cảm thấy 2 lưu 2 chỗ này không có gì khác nhau mấy (khác nhau về bộ nhớ thì đây là điểm khác biệt em thấy trước mắt). Cho em hỏi trong thực tế thì người ta lưu trong cookie hay localStorage ?, trường hợp nào dùng cookie, trường hợp nào localStorage. Em cảm ơn

P/S: không thể dùng JavaScript để thao tác với browser cache.