本地存储

Cookie是服务器发送到用户浏览器并保存在本地的数据，它会在浏览器下次向同一服务器再发起请求时被携带上并发送到服务器上。

使用方式：通过document.cookie来设置、获取和删除Cookie。
优点：兼容性好，所有主流浏览器都支持；可以设置过期时间。
缺点：存储容量有限，一般不超过4KB；每次请求都会携带，会增加请求的数据量。
应用场景：标记用户与跟踪用户行为。

Web Storage

Web Storage提供了一种在浏览器中存储键值对的方式，分别为localStorage和seesionStorage。

localStorage：数据会永久存储，除非手动删除，关闭浏览器后数据不会丢失。
sessionStorage：数据仅在当前会话期间有效，关闭浏览器窗口或者标签页后数据会被清掉。
使用方式：通过setItem设置、getItem获取、removeItem删除以及clear清空数据。
优点：存储容量一般为5MB或者更大；不会随着HTTP请求发送，不影响请求性能。
缺点：只能存储字符串类型的数据，如果要存储对象，需要先转换为字符串；数据仅在客户端存储，无法在服务器端直接访问。
应用场景：localStorage 长期保存本地的数据，sessionStorage敏感账号一次性登录。

IndexedDB

IndexedDB是一种在浏览器中存储大量数据的数据库系统，它是一个基于事务的数据库，支持存储多种类型的数据，包括对象。

使用方式：使用IndexedDB主要包括以下几个步骤，打开数据库、创建对象仓库、进行数据库的增删改查操作。
优点：存储量大，一般没有限制；支持存储多种类型的数据，包括对象；支持事务操作，保持数据的一致性；可以进行索引查询，提高查询效率。
缺点：API相对复杂，使用起来有一定难度；不同浏览器的实现可能存在差异。
应用场景：存储在线文档（富文本编辑器）保存编辑历史数据。