0.0.12 • Published 3 years ago
@cicerchie/svelte-swr v0.0.12
Cicerchie Svelte-SWR
A stale-while-revalidate data fetching library for Svelte.
WARNING!
These components are still "experimental" (v0.x.x
).
Some of them are not tested as rigourously as it should be and none of them have been through code review.
Use them at your own risk and check that them do what you want them to do.
Installation
npm install @cicerchie/svelte-swr
Usage
<script>
import { useSWR } from "@cicerchie/svelte-swr";
const players = useSWR<PlayerList>();
$: players.update({
key: `players?page=${page}&filter=${JSON.stringify(filter)}`,
fn: () => playersService.list({ page, filter }),
});
</script>
{#if $players.isLoading}
Loading...
{:else if $players.error}
{$players.error}
{:else}
{#each $players.data.players as player (player.id)}
ID: {player.id}
{:else}
No players yet
{/each}
{/if}
Changelog
Is automagically updated with each release and you can read it here.
Features
- Transport and protocol agnostic
- Jamstack oriented
- Fast, lightweight and reusable data fetching (fast page navigation, fast UI)
- Built-in cache
- Cache data and retrieve it when needed
- Initial immediate data (offline or already cached)
- Global
onError
custom handler - Typescript ready (still incomplete and so many
any
!) - Pagination (done, docs needed)
- Requests deduplication
- Enable and disable it with a prop
- Polling on interval
- Revalidation on window focus
- Revalidation on network recovery
- Local mutation (Optimistic UI)
- Smart error retry
- Scroll position recovery
- Persist and restore from LocalStorage/IndexedDB
- Clear cache when you need to invalidate all data or specific keys
TODO
- Docs (HELP!)
- Tests (HELP!)
- Demo site (using
routes
dir: it's a SvelteKit app!)