next-storage-provider v0.2.0
A Next.JS plugin to store and cache ISR rendered pages using Redis and Amazon S3 like APIs
❗ Important before using ❗
Using a custom storage provider in Next.JS is currently NOT supported (and probably won't be in the near future) and this plugin relies on this pull request made by MartinLG. If you want to use this plugin you must use the extends-storage-and-cache branch from his Next.JS's fork or modify and compile Next yourself.
Install
yarn install next-storage-provider
Usage
Create a next.config.js
in your project.
Next-storage-provider works out of the box with the default configuration file of Redis (not recommended)
// next.config.js
const withStorageProvider = require("next-storage-provider");
module.exports = withStorageProvider({
redis: {},
});
With next-compose-plugins
// next.config.js
const withPlugins = require("next-compose-plugins");
const withStorageProvider = require("next-storage-provider");
module.exports = withPlugins([
[
withStorageProvider,
{
redis: {},
},
],
]);
Redis configuration
Redis should be set as an LRU (or LFU) cache using the maxmemory
directive with an eviction policy of your choice.
See Using Redis as an LRU cache for more.
Options
redis
This plugin uses ioredis as Redis client.
You can either pass an existing ioredis
client or pass an object with ioredis
options.
const Redis = require("ioredis");
const redisClient = new Redis({
host: "127.0.0.1",
port: 7000,
});
const withStorageProvider = require("next-storage-provider");
module.exports = withStorageProvider({
redis: redisClient,
});
or
const withStorageProvider = require("next-storage-provider");
module.exports = withStorageProvider({
redis: {
host: "127.0.0.1",
port: 6380,
username: "user",
passoword: "password",
},
});
prefix
Redis only.
The prefix that will be used for the key in redis.
Defaults to next_cache
.
module.exports = withStorageProvider({
prefix: "my_prefix",
});
fallback
Redis only.
If set to true
, whenever trying to get the cache or storing a page fails, a per-process LRU cache will be used as fallback to get/store pages.
Defaults to false
.
module.exports = withStorageProvider({
redis: {},
fallback: true,
});
max
Only used when fallback
is used.
Sets the maximum size of the cache.
Defaults to 50 MB.
module.exports = withStorageProvider({
max: 100 * 1024 * 1024, // 100 MB,
});
expire
Whether cached pages should be removed from Redis after their revalidate time has passed.
If a cached entry expires, no cached content will be sent and the user will receive the rendered page after Next is done rendering.
This way you can avoid showing a cached entry to the user that will trigger a page re-render after revalidate.
Defaults to false
.
module.exports = withStorageProvider({
redis: {},
expire: true,
});
useS3
If set to true
, an Amazon S3 like object storage will be used to get/store generated HTML and JSON page files and a per-process LRU cache will be used instead.
Files are only requested if the page data is missing from the cache, and are only stored when a page is regenerated (2 requests per page are made when getting or storing data, as the HTML and JSON (page props) are stored separately).
S3Config
Next-storage-provider uses MinIO-JS as S3 client. You can find all the options available in MinIO's documentation.
Example with Amazon S3:
const withStorageProvider = require("next-storage-provider");
module.exports = withStorageProvider({
useS3: true,
S3Config: {
endPoint: "s3.amazonaws.com",
accessKey: "YOUR-ACCESSKEYID",
secretKey: "YOUR-SECRETACCESSKEY",
},
});
Contributing
Contributions, issues and feature requests are welcome! Feel free to check issues page.
Both ESlint and Prettier checks must pass:
yarn run lint
yarn run prettier
Run both ESLint and Prettier on all files:
yarn run format
If changing the README:
yarn run prettier:readme
yarn run format:readme
📝 License
Copyright © 2021 reboxer (https://github.com/reboxer). This project is MIT licensed.