Sveltekit Superfetch

Overview

The SvelteKit Superfetch library is a tool that allows developers to interact with APIs, providing support for optional logging of requests and responses. It is designed to be easy to use and customizable, with default options for timeout and retries.

Features

• API Interaction: Easily make API requests using the library, with a similar syntax to the standard fetch API.
• Timeout and Retries: The library has default options for a timeout of 8 seconds and 3 retries, which can be customized if needed.
• Optional Logging: Developers have the option to enable logging of requests and responses, providing useful information for debugging and error tracing.

Installation

1. Start by installing the Superfetch library using your preferred package manager: npm install sveltekit-superfetch

2. Create a new instance of Superfetch in a separate file, which can be imported wherever needed in your project. If you want to use the default options, you can do:

// lib/superfetch.ts

import { Superfetch } from 'sveltekit-superfetch';

const superfetch = new Superfetch();
export default superfetch;

3. If you need to customize the fetcher options, you can pass in an options object during the instance creation. For example:

// lib/superfetch.ts

import { SuperfetchOptions, Superfetch } from 'sveltekit-superfetch';

const options: SuperfetchOptions = {
  limitedPaths: ['/'],
  timeout: 10000, // 10 seconds
  retries: 5
};

const superfetch = new Superfetch(options);
export default superfetch;

4. Now you can use the Superfetch instance to make API requests. Here are a few examples:

• Example fetch using POST method, headers, and body:

const response = await superfetch.fetch('/api/endpoint', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({ key: 'value' })
});

• Example fetch that will be cached server-side with optional TTL (Time to Live) override:

const response = await superfetch.fetch('/api/data', {
  cache: {
    enabled: true,
    ttl: 600 // 10 minutes
  }
});

5. You can also use Superfetch to cache API requests, even with a relatively short TTL. It can greatly improve performance and reduce hits to third-party APIs on high-traffic sites. However, it’s important to note that caching should only be used for GET requests and not for sensitive or dynamic endpoints, like customer profiles.

6. Lastly, if you create a new instance of Superfetch without passing in a logger instance, it will default to using console.log() and console.error() for logging.

Summary

The SvelteKit Superfetch library is a powerful tool for interacting with APIs in SvelteKit projects. It provides an easy-to-use interface, customizable options, and optional logging for requests and responses. By following the installation guide and using the provided examples, developers can make efficient and reliable API requests with Superfetch.