🧠 强化版Redux：在不破坏浏览器的情况下将状态持久化到IndexedDB
内容提要
在现代React应用中，结合redux-persist、IndexedDB和fflate压缩，可以有效存储多达50MB的Redux状态，避免localStorage的限制。通过自定义转换实现状态的压缩与解压，保持IndexedDB在安全范围内，并自动清理过期缓存，适用于离线数据和大状态项目。
延伸解读
IndexedDB的优势与局限
IndexedDB相较于localStorage，支持更大的存储容量和复杂数据结构，适合需要持久化大量状态的应用。然而，当存储超过50MB时，可能会遇到QuotaExceededError，因此在使用时需注意控制数据量，避免应用崩溃。
状态压缩的重要性
通过使用fflate库进行状态压缩，可以有效减少持久化状态的大小40-60%。这不仅提升了存储效率，还能降低浏览器的负担，确保应用在处理大数据时依然流畅。
自动清理机制的必要性
在IndexedDB中存储数据时，编写递归清理函数以自动删除过期缓存是非常重要的。这可以确保存储空间始终在安全范围内，避免因存储超限导致的应用故障。
Q&A
如何在React应用中持久化Redux状态？
可以使用redux-persist结合redux-persist-indexeddb-storage和IndexedDB来实现Redux状态的持久化。
为什么IndexedDB比localStorage更适合存储大数据？
IndexedDB支持更大的存储容量（约50MB）和复杂对象，而localStorage仅支持约5MB的字符串。
如何使用fflate库压缩Redux状态？
通过自定义转换，使用fflate库在保存状态时进行压缩，并在恢复状态时进行解压。
如何处理IndexedDB的QuotaExceededError？
可以编写递归清理函数，自动删除最旧的缓存数据，以保持IndexedDB的大小在安全范围内。
使用redux-persist和IndexedDB的主要好处是什么？
主要好处是能够存储更大的Redux状态，减少持久化状态的大小，并提高应用性能。
如何配置Redux存储以支持IndexedDB和压缩？
需要设置persistConfig，指定storage为IndexedDB，并添加fflateTransform进行压缩。
