饼干：

在HTML5之前介绍。 有有效期。 通过JS或浏览器的“清除浏览数据”或过期日期清除。 将每个请求发送到服务器。 容量为4KB。 只有字符串可以存储在cookie中。 有两种类型的cookie:持久cookie和会话cookie。

本地存储:

由HTML5引入。 没有过期日期。 由JS或浏览器的“清除浏览数据”清除。 您可以选择何时必须将数据发送到服务器。 容量为5MB。 数据是无限存储的，必须是字符串。 只有一种。

cookie和本地存储有不同的用途。cookie主要用于读取服务器端，本地存储只能由客户端读取。所以问题是，在你的应用程序中，谁需要这些数据——客户端还是服务器?

如果它是你的客户端(JavaScript)，那么无论如何都要切换。在每个HTTP报头中发送所有数据是在浪费带宽。

如果它是您的服务器，本地存储就不是那么有用了，因为您必须以某种方式(使用Ajax或隐藏表单字段或其他东西)转发数据。如果服务器对每个请求只需要总数据的一小部分，那么这样做是可以的。

不管怎样，您都希望将会话cookie保留为cookie。

根据技术上的差异，以及我的理解:

除了作为一种古老的保存数据的方式，cookie给你一个4096字节的限制(实际上是4095字节)-这是每个cookie。本地存储每个域高达10MB -这个堆栈溢出问题也提到了它。 localStorage是存储接口的实现。它存储的数据没有过期日期，只通过JavaScript或清除浏览器缓存/本地存储的数据-不像cookie过期。

值得一提的是，当用户在某些版本的移动Safari中以“私有”模式浏览时，localStorage不能被使用。

引自视窗MDN专题的WayBack档案。2018年的localStorage:

注意:从iOS 5.1开始，Safari Mobile将localStorage数据存储在缓存文件夹中，在操作系统的要求下，通常在空间不足的情况下，会偶尔清理缓存文件夹。Safari Mobile的私密浏览模式也完全阻止了对localStorage的写入。

本地存储最多可以存储5mb的离线数据，而会话也可以存储5mb的数据。但是cookie只能以文本格式存储4kb的数据。

LOCAl和Session存储数据为JSON格式，因此易于解析。但是cookie数据是字符串格式。

饼干：

在HTML5之前介绍。 有有效期。 通过JS或浏览器的“清除浏览数据”或过期日期清除。 将每个请求发送到服务器。 容量为4KB。 只有字符串可以存储在cookie中。 有两种类型的cookie:持久cookie和会话cookie。

本地存储:

由HTML5引入。 没有过期日期。 由JS或浏览器的“清除浏览数据”清除。 您可以选择何时必须将数据发送到服务器。 容量为5MB。 数据是无限存储的，必须是字符串。 只有一种。

本地存储速度很大程度上取决于客户端使用的浏览器以及操作系统。mac上的Chrome或Safari可能比PC上的Firefox快得多，尤其是使用了更新的api后。和往常一样，测试是你的朋友(我找不到任何基准测试)。

我真的没有看到cookie和本地存储有很大的区别。此外，你应该更担心兼容性问题:不是所有的浏览器都开始支持新的HTML5 api，所以cookie将是你在速度和兼容性方面的最佳选择。