JavaScript lưu trữ cục bộ là gì

Tìm kiếm lưu trữ thông tin của người dùng tại trình duyệt web như lưu trữ trong trò chơi, lưu trữ tạm thời các hiệu ứng, cookie là lựa chọn tốt nhất hi hi

• Dung lượng tối đa 4KB
• Dữ liệu phải gửi qua lại giữa máy chủ và máy khách khi phát sinh yêu cầu

Để chủ động hơn, HTML5 hiện thực một khái niệm mới là localStorage

• Hỗ trợ lưu trữ và sử dụng nó linh hoạt tại giao diện người dùng
• Dung lượng của localStorage vào khoảng 2MB đến 10MB
• localStorage không liên hệ với máy chủ
• Muốn gửi thông tin này đến máy chủ ta có thể chủ động thông qua yêu cầu http

localStorage là gì?

localStorage là cách thức lưu trữ dữ liệu tại máy khách độc lập với máy chủ. Giả định viết 1 ứng dụng web chọn pHép người dùng viết bài trên stdio, thực chất người dùng chưa lưu trữ bài viết nhưng lại gặp sự cố về máy nhỏ, ở lần mở web sau sẽ kiểm tra trong localStorage có dữ liệu hay không , if there are could ask the user that you want to restore the version has doing khĻng việó?

Xem thực hiện tính năng Ăn lưu trữ tạm thời này, yêu cầu mỗi 5 phút dữ liệu tự lưu trữ lên máy chủ, nếu chỉ yêu cầu lưu trữ trong trình duyệt web, localStorage là phiền phức. Máy chủ sẽ giảm lượng yêu cầu đáng kể nhưng vẫn mang lại trải nghiệm tốt cho người dùng. Ngoài ra, thời gian lưu trữ của localStorage có thể kéo dài cho đến khi giao diện người dùng ra lệnh xóa

Cách sử dụng localStorage

Kiểm tra trình duyệt có hỗ trợ localStorage hay không?

Để sử dụng localStorage, trình duyệt cần hỗ trợ HTML5 bật lên. Tại thời điểm này, trình duyệt web hiện đã hỗ trợ choc html5, tuy nhiên ta vẫn nên kiểm tra xem localStorage như 1 Thói quen tốt vì cóc tiện ích không hỗ trợ

Nếu trình duyệt có hỗ trợ thì thông báo sau sẽ hiện lên

Lưu mới, thay đổi hoặc lấy dữ liệu từ localStorage

Save, change data

Kiểm tra dữ liệu đã tồn tại hay chưa

localStorage.getItem(name) == null

Clear data

localStorage.removeItem(name)

ví dụ

Dữ liệu có được lưu tại trình duyệt web của người dùng, cần thận trọng việc dữ liệu thay đổi có gây nguy hiểm cho hệ thống quản giáo dƹc Rỗng hoẺ?

Như chúng ta đã biết, http là một giao thức không có trạng thái, Máy khách khởi tạo một yêu cầu, có thể chủ động xử lý yêu cầu từ máy khách và sau đó gửi phản hồi. Sau khi quá trình trao đổi dữ liệu giữa Máychách và máy chủ hoàn tất, kết nối giữa máy chủ và Máy khách sẽ bị đeg lại, Máy chủ hầu như không có thông tin phân tích không thể ghi lại chuỗi yêu cầu của người dùng truy cập mỗi khi dữ liệu được trao đổi Cần thiết lập kết nối mới, sau đó có người dùng, trang web muốn hiểu theo yêu cầu của người dùng, tuy nhiên theo hiện trường lúc đó thì Rõ ràng Ràng không thể trả lời ứng dụng được yêu cầu job, main vó

Bài viết liên quân. 10 mẹo để cải thiện hiệu suất của các ứng dụng Web lên 10 lần

Local Storage là gì?

Local Storage là một loại lưu trữ chủ yếu trên web cho phép các trang web và ứng dụng JavaScript lưu trữ và truy cập dữ liệu ngay trong trình duyệt mà không có ngày hết hạn. Điều này có nghĩa là dữ liệu được lưu trữ trong trình duyệt sẽ vẫn tồn tại ngay cả khi cửa sổ trình duyệt đã bị đóng. Và một bài viết này tổng hợp lại 8 thư viện xử lý JavaScript cửa hàng địa phương rất gọn nhẹ, và bạn có thể sử dụng bất cứ khi nào bạn cần

1 - Cầu lưu trữ cục bộ

https. //github. com/krasimir/lsbridge

Nếu bạn phải gửi tin nhắn từ tab này sang tab khác trong cùng một trình duyệt, bạn không cần phải sử dụng cách khó. Sử dụng lsbridge ở đây để làm cho nhiệm vụ này của bạn dễ dàng hơn.  

ví dụ

2 - Húng quế. js

húng quế. js la gi? . js có nhiệm vụ hợp nhất của phiên, localStorage và cookie, đồng thời cung cấp cho bạn một phương pháp xử lý dữ liệu trực tiếp. https. // khôn ngoan. github. io/húng quế. js/

Sử dụng cơ bản

let basil = new Basil(options);
basil.set(‘name’, ‘Amy’);
basil.get(‘name’);
basil.remove(‘name’);
basil.reset();

3 cửa hàng. js

https. //github. com/marcuswestin/cửa hàng. js

cửa hàng. js la gi? . js xử lý việc lưu trữ dữ liệu giống như mọi thứ khác. Nhưng có nhiều chức năng hơn và một trong những tính năng nâng cao của nó là cho phép bạn truy cập sâu hơn vào trình duyệt hỗ trợ.  

Sử dụng cơ bản

4 - lscache

https. //github. com/pamelafox/lscache

lscache tương tự như API localStorage. Trên thực tế, nó là một trình bao bọc cho localStorage và sử dụng HTML5 để mô phỏng các memcaches chức năng. Tìm thêm các tính năng trong tài liệu trên.  

Gợi ý. 8 mẹo tối ưu hóa javascript mọi developer đều phải biết

Sử dụng cơ bản

lscache.set(‘name’, ‘Amy’, 5); 
lscache.get(‘name’);

5 - Lockr là gì?

Lockr được xây dựng dựa trên API localStorage. Nó cung cấp một số phương pháp hữu ích để xử lý dữ liệu cục bộ dễ dàng hơn. Điều gì khiến bạn muốn sử dụng thư viện này thay vì API localStorage? . Nếu bạn muốn lưu trữ một số, trước tiên bạn phải chuyển số đó thành chuỗi. Điều này sẽ không xảy ra trong Lockr, vì Lockr cho phép bạn lưu trữ nhiều loại dữ liệu hơn và thậm chí cả các đối tượng.  

Sử dụng cơ bản

Lockr.set(‘name’, ‘Amy’);
Lockr.set(‘age’, 28);
Lockr.set(‘books’, [{title: ‘JavaScript’, price: 11.0}, {title: ‘Python’, price: 9.0}]);

6 - Chuồng trại

https. //github. com/arokor/chuồng

Barn cung cấp một API giống như Redis trên localStorage. Nếu sự bền bỉ là quan trọng, thì bạn sẽ cần đến thư viện này để duy trì trạng thái dữ liệu trong trường hợp xảy ra lỗi.  

Sử dụng cơ bản

7 - thức ăn gia súc địa phương

https. //github. com/localForage/localForage

Thư viện đơn giản và nhanh chóng này sẽ sử dụng kho lưu trữ không đồng bộ thông qua IndexedDB hoặc WebSQL để cải thiện trải nghiệm triển khai trí tuệ nhân tạo Weban. Nó tương tự như localStorage, nhưng có chức năng gọi lại.  

Sử dụng cơ bản

8 mật mã. io

https. //github. com/jas-/crypt. io

hầm mộ. io sử dụng thư viện mã hóa JavaScript tiêu chuẩn để triển khai lưu trữ trình duyệt an toàn. Khi sử dụng tiền điện tử. io, cóba tùy chọn lưu trữ. sessionStorage, localStorage hoặc cookie.  

Sử dụng cơ bản

Lời kết

Trên đây là 8 thư viện javascript cần thiết cho việc lưu trữ bộ dữ liệu tổng thể dành cho những bạn nào thực sự cần thiết. Nhưng mà tôi cũng khuyến khích các bạn nên học cách sử dụng javascript vanilla hơn, vì khi học chung ta sẽ pHải mằn nhiều thứ hơn từ đó bạn có.  

Nếu bạn nào biết thêm một hay nhiều thư viện nữa thì vui lòng comment bên dưới bài viết để mình và các bạn có thể tham khảo thêm. Chúc may mắn