Caching
Client-Side Caching
Query responses using the built-in composables are cached by default. Meaning, if you call the same query multiple times, the response will be cached and returned from the cache on subsequent calls.
For each query, a hash is calculated based on the query string and the requested language (in multi-language setups).
If you want to disable caching, you can do so by setting the cache
option to false
:
const { data } = await useKql(
query,
{
// Disable caching
cache: false
}
)
Server-Side Caching
nuxt-kql
lets you opt in to server-side caching of query responses. It does so by utilizing the cache API of Nuxt's underlying server engine, Nitro. Query responses are cached in-memory. For short concurrent requests on your website, it will make a great performance difference, as the query response will be served from the cache instead of being fetched from the server again.
The default expiration time is set to 60 minutes. This limit will probably never be hit in serverless deployment environments.
You can enable server-side caching by setting the server.cache
module option to true
. You can also set a custom expiration time in seconds by setting the server.maxAge
option or disable stale-while-revalidate behavior by setting the server.swr
option to false
:
// `nuxt.config.ts`
export default defineNuxtConfig({
modules: ['nuxt-kql'],
kql: {
server: {
// Enable server-side caching
// @default false
cache: true,
// Control stale-while-revalidate behavior
// @default true
swr: true,
// Set a custom expiration time in seconds
// @default 60 * 60
maxAge: 60 * 60
}
}
})