react-fast-fetch

library2.0.1jsnpmunverified

A React hook library for fetching and caching remote data with stale-while-revalidate strategy. Version 2.0.1 ships TypeScript types and supports multiple storage backends: MemoryStore, StorageStore (localStorage/sessionStorage), IndexedDBStore, and CacheStore. It differentiates from SWR by offering built-in IndexedDB support for large persistent caches exceeding 10GB. Install via npm; peer dependency on React >=16.8.0. Release cadence: occasional updates.

testing

npm install react-fast-fetch

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · REACT-FAST-FETCH

react-fast-fetch

testingjavascriptv2.0.1

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

useFetch

✓ import { useFetch } from 'react-fast-fetch'

✗ const useFetch = require('react-fast-fetch').useFetch

ESM-only since v2; CommonJS require pattern is incorrect for named exports

FetchProvider

✓ import { FetchProvider } from 'react-fast-fetch'

✗ import FetchProvider from 'react-fast-fetch'

FetchProvider is a named export, not default export

IndexedDBStore

✓ import { IndexedDBStore } from 'react-fast-fetch'

✗ import IndexedDBStore from 'react-fast-fetch/lib/IndexedDBStore'

All stores are exported from the main package entry; no deep imports needed

Demonstrates basic usage of useFetch, FetchProvider, and MemoryStore with a custom fetcher

import { useFetch, FetchProvider, MemoryStore } from 'react-fast-fetch'; const fetcher = (url) => fetch(url).then((res) => res.json()); const store = new MemoryStore({ limit: 100 }); function App() { const { data, loading, error, reload } = useFetch('https://api.example.com/data', { store }); if (loading) return <div>Loading...</div>; if (error) return <div>Error: {error.message}</div>; return ( <div> <pre>{JSON.stringify(data, null, 2)}</pre> <button onClick={reload}>Refresh</button> </div> ); } export default function Root() { return ( <FetchProvider fetcher={fetcher} store={store}> <App /> </FetchProvider> ); }

Debug

Known issues

gotchaIndexedDB I/O can be 10-1000ms; do not use for high-frequency updates.

fix

Use MemoryStore or StorageStore for latency-sensitive caches

affects: >=1.0

gotchaStorageStore (localStorage) size limit is 5MiB; exceeding causes quota errors.

fix

Switch to IndexedDBStore for larger data or handle quota errors gracefully

affects: >=1.0

breakingIn v2.0.0, the package became ESM-only; require() fails with ERR_REQUIRE_ESM.

fix

Use import syntax or dynamic import() in Node.js with "type": "module"

affects: >=2.0.0 <3.0.0

deprecatedThe old global configuration via window.__REACT_FAST_FETCH_CONFIG__ is deprecated in v1.5+ and removed in v2.

fix

Use FetchProvider component instead

affects: >=1.5 <2.0.0

gotchauseFetch returns stale data until revalidation completes; beware of displaying outdated info.

fix

Set preserve: false to clear data on URL change, or show a loading indicator

affects: >=1.0

Errors

Common errors & fixes

TypeError: Cannot read properties of undefined (reading 'version')

Accessing data before it's loaded; loading is false but data is still undefined

fix

Check loading state before accessing data properties: if (loading) return <Spinner />; return <div>{data.version}</div>

Error: limit exceeded: cannot cache more than 100 items

Store limit reached; default MemoryStore limit is 100 or lower

fix

Increase limit when instantiating the store: new MemoryStore({ limit: 5000 })

QuotaExceededError: Failed to execute 'setItem' on 'Storage'

localStorage quota exceeded (5MiB per origin)

fix

Use IndexedDBStore or CacheStore instead of StorageStore, or reduce cache size

TypeError: (0 , react_fast_fetch.useFetch) is not a function

Using require() on ESM-only package (v2+) with CommonJS module system

fix

Switch to import syntax or enable ESM in your project ("type": "module" in package.json)

Upgrade

Version history

2.0.1latest on npm

Audit

Dependencies

reactrequiredPeer dependency required for React hooks

Agent activity

6 hits · last 30 days

node

Resources

githubhttps://github.com/guoyunhe/react-fast-fetch ↗

packagereact-fast-fetch ↗

homepagehttps://github.com/guoyunhe/react-fast-fetch#readme ↗