Appearance
localStorage到底是同步的还是异步的?
首先明确一个答案,localStorage是同步的!
其实可以进行一个很基本的实验,使用 localStorage
中的 setItem( )
方法将一个非常长的字符串存入,代码后面执行 alert( )
方法。会发现 alert( )
方法明显在等待前面代码的执行,即代码被阻塞了。由此可以证明,localStorage
是同步的。
localStorage
虽然在不同浏览器中所在用的方案不尽相同,但是主流浏览器还是将 localStorage
中的数据存储在了磁盘中。众所周知,磁盘的I/O为了避免出现长时间等待的情况,一般采用的都是异步的方案,但是为什么 localStorage 是存储在磁盘中的,而却是同步的呢?
在早期浏览器的实现过程中,那时候 localStorage
刚被引入,浏览器技术还没有广泛支持如 Promises
和 async/await
这样的异步编程特性。为了确保兼容性和简易性,localStorage
的 API 设计成了同步的,这算是历史遗留的原因。
一旦一种 API 模式被广泛采用,改变它可能会破坏现有的网站和应用程序。因此,即使现在有更先进的异步编程方式,为了保持向后兼容性,浏览器制造商在 localStorage
上依然保留了其同步的行为。
同时对于大多数情况下 localStorage
只存储少量数据,同步调用不会显著影响性能。而且现代浏览器制造商大都在其内部优化了这些调用来减少阻塞时间,比如通过将实际的磁盘写入延迟到空闲时段(idle time),以尽量减少对页面响应的影响等等一系列优化措施,尽量减少对页面交互的相应。
虽然从 JavaScript 角度看 localStorage
是同步的,但浏览器内部可能会做一些优化来改善性能,也就是说 Js 在操作上的同步并不一定是真的在磁盘I/O中是同步的,浏览器可能会缓存 localStorage
数据在内存中,并在合适的时机批量写入磁盘,这样可以减少直接的磁盘 I/O 开销。
localStorage
提供了一个简单的键值对存储机制,它模仿了传统的字典或哈希表数据结构。这种简单性使得开发者可以很容易地使用它,而无需处理复杂的异步代码模式。
但是这种持久化机制只适用于需要在用户会话之间保持的非敏感数据,localStorage
并不是设计用来安全地存储敏感信息的,因为这些数据是以明文形式存储的,并且对同一个源(origin)下的所有页面和脚本都是可访问的。
所以,localStorage
并不是一个安全的存储方案,它应该被用于存储用户会话相关的数据,如用户登录状态、购物车信息、用户设置等。如果需要更为复杂的存储策略更推荐使用数据库或者IndexedDB。