Back to Home
qortex-react
React Integration

qortex-react

React hooks for data fetching with smart caching, background updates, and full TypeScript support.

npm install qortex-react

Quick Start

import { useQuery, useMutate, registerFetcher } from 'qortex-react';
// Register a fetcher
registerFetcher('users', async () => {
const res = await fetch('/api/users');
return res.json();
});
// Use in your component
function UserList() {
const { data, isLoading, error } = useQuery('users');
if (isLoading) return <div>Loading...</div>;
if (error) return <div>Error: {error.message}</div>;
return (
<ul>
{data.map(user => (
<li key={user.id}>{user.name}</li>
))}
</ul>
);
}

Features

Auto Caching

Automatic request deduplication and caching

Background Updates

Stale-while-revalidate with previousData

No Loading Flickers

Keep showing old data during refetch

TypeScript First

Full type inference for your data

Error Handling

Declarative error states with retry

Persistence

Optional localStorage/sessionStorage sync

React Hooks

HookDescription
useQueryFetch and cache data with loading/error states
useMutatePerform mutations with optimistic updates
useQueryDataSubscribe to cached data reactively
useQuerySelectSelect and transform cached data

Includes All Core APIs

qortex-react re-exports everything from qortex-core, so you get all the core functionality too.

import { useQuery, registerFetcher, fetchQuery, getQueryData } from 'qortex-react';

Tiny Bundle Size

Lightweight and optimized for performance.

~2.6KBmin + gzip

~0.7KB (React) + ~1.9KB (Core)

2.6KB / 10KB Performance Budget

Minified Size~6.5KB
Dependencies1
Tree Shaking
Supported

Ready to get started?

npm install qortex-react

Read the Documentation