Remix Client Cache screenshot

Remix Client Cache

Author Avatar Theme by Forge 42
Updated: 27 Apr 2025
245 Stars

Utility library to cache your client data in Remix.run

Categories

Overview

The remix-client-cache is an innovative library designed specifically for use with the React Router v7 framework. It effectively caches server loader data on the client side using clientLoaders, providing a seamless experience for developers looking to enhance their applications’ performance. By leveraging a stale while revalidate strategy, this library ensures that stale information is quickly swapped out for updated data pulled from the server.

What makes remix-client-cache particularly appealing is its flexibility in configuration. With the option to pass in different cache adapters, developers can tailor the caching mechanism to suit their specific needs. The library supports first-party storage solutions such as localStorage and sessionStorage, and even allows for the implementation of custom adapters. This makes it a versatile choice for modern React applications that rely heavily on dynamic data fetching.

Features

  • Stale While Revalidate Strategy: Automatically updates stale data with fresh information from the server, ensuring a smooth user experience.

  • Custom Cache Adapters: Expand the library’s adaptability by providing your own cache adapter that implements the CacheAdapter interface.

  • First Party Storage Support: Natively supports localStorage, sessionStorage, and localforage, making it easy to configure global caches.

  • Memory Cache by Default: Comes with a built-in in-memory storage option that is quick and efficient for caching.

  • Cache Invalidation: Easily invalidate specific cache keys or multiple keys, allowing for more controlled data management.

  • CacheRouteWrapper Function: Wraps a component to provide loader data seamlessly, enhancing modular code structures.

  • Create Cache Adapter Function: Facilitates the creation of custom cache adapters for varied use cases, enhancing application flexibility.

  • Global and Per Route Configurations: Offers the ability to set a global cache adapter or create route-specific adapters, allowing for tailored configurations based on the application’s architecture.