Sswr screenshot

Sswr

Author Avatar Theme by Consoletvs
Updated: 26 Oct 2025
287 Stars

Svelte stale while revalidate (SWR) data fetching strategy

Categories

Overview

SSWR (Svelte Stale While Revalidate) is a data fetching strategy for Svelte components based on the stale-while-revalidate HTTP cache invalidation strategy. It allows components to first return data from cache, then send a fetch request to update the data, resulting in a fast and reactive user interface.

Features

  • Built for Svelte: Specifically designed for Svelte components.
  • Extremely small: Only 2KB in size and well-packed.
  • No dependencies: Only requires one polyfill for EventTarget.
  • Built-in cache and request deduplication: Caches data and avoids duplicate requests.
  • Dependent fetching: Fetches data that depends on other data.
  • Real-time experience: Provides a stream of data updates.
  • Typescript friendly: Works well with Typescript.
  • Error handling: Supports error handling using the provided error variable.
  • Efficient DOM updates: Uses Svelte reactivity for efficient DOM updates.
  • Efficient HTTP requests: Only makes requests when needed.
  • Manual revalidation: Allows manual revalidation of data using revalidate().
  • Optimistic UI / Manual mutation: Supports manual mutation of data using mutate().
  • Window focus revalidation: Automatically revalidates data when window focus changes.
  • Network change revalidation: Automatically revalidates data when network changes.
  • Initial data support: Supports initial or offline data.
  • Cache clearing: Provides the ability to clear the cache for all data or specified keys.
  • Offline support: Can be used without revalidations with string keys.
  • Global configuration: Supports global configuration options or per hook call.

Installation

To install SSWR, you can use either npm or yarn:

npm install svelte-stale-while-revalidate

or

yarn add svelte-stale-while-revalidate

Summary

SSWR is a Svelte data fetching strategy based on the stale-while-revalidate HTTP cache invalidation strategy. It provides several key features such as built-in caching, efficient DOM updates, dependent fetching, and error handling. With SSWR, components can provide a real-time and reactive user experience while minimizing unnecessary network requests.