Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

nuxt-multi-cache

Package Overview
Dependencies
Maintainers
1
Versions
27
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

nuxt-multi-cache - npm Package Compare versions

Comparing version 1.2.0 to 2.0.0-beta.0

dist/module.cjs

85

package.json
{
"name": "nuxt-multi-cache",
"version": "1.2.0",
"version": "2.0.0-beta.0",
"description": "SSR route, component and data cache for Nuxt.js",
"type": "module",
"exports": {
".": {
"import": "./dist/module.mjs",
"require": "./dist/module.cjs"
}
},
"main": "./dist/module.cjs",
"types": "./dist/types.d.ts",
"keywords": [

@@ -19,5 +28,17 @@ "nuxt",

"scripts": {
"build": "tsc -p tsconfig-esm.json && tsc -p tsconfig-cjs.json",
"typedoc": "typedoc --out foo --namedAnchors true --publicPath /configuration/ src/index.ts",
"prettier": "prettier ./src --write"
"prepack": "nuxt-module-build",
"dev": "nuxi dev playground",
"dev:build": "nuxi build playground",
"dev:prepare": "nuxt-module-build --stub && nuxi prepare playground",
"generate": "nuxi generate",
"typecheck": "nuxi typecheck",
"docs:dev": "vitepress dev docs --port 5000",
"docs:build": "vitepress build docs",
"docs:serve": "vitepress serve docs --port 5000",
"prettier": "prettier ./src --check",
"prettier:fix": "prettier ./src --write",
"fake-data": "node ./scripts/fakeData.js",
"test": "TZ=utc vitest",
"test:ci": "TZ=utc vitest run",
"test:coverage": "TZ=utc vitest run --coverage"
},

@@ -28,43 +49,29 @@ "repository": {

},
"main": "./lib/cjs/index.js",
"module": "./lib/esm/index.js",
"types": "./lib/types/index.d.ts",
"browser": {
"./index.js": "./client.js"
},
"files": [
"lib/",
"client.js",
"client.d.ts"
"dist"
],
"dependencies": {
"basic-auth": "^2.0.1",
"express": "^4.17.1",
"lowdb": "^2.1.0",
"lru-cache": "^6.0.0",
"make-dir": "^3.1.0",
"mkdirp": "^1.0.4",
"sqlite3": "^5.0.2",
"ufo": "^0.7.5"
"@nuxt/kit": "^3.0.0",
"@tusbar/cache-control": "^0.6.1"
},
"devDependencies": {
"@nuxt/types": "^2.15.6",
"@types/basic-auth": "^1.1.3",
"@types/lru-cache": "^5.1.0",
"@types/mkdirp": "^1.0.1",
"@types/node": "^15.12.1",
"@types/sqlite3": "^3.1.7",
"eslint": "^7.28.0",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-nuxt": "^2.0.0",
"eslint-plugin-prettier": "^3.4.0",
"globby": "^11.0.3",
"nuxt": "^2.15.6",
"prettier": "^2.3.1",
"typedoc": "^0.20.36",
"typedoc-plugin-markdown": "^3.9.0",
"typescript": "^4.2.4",
"vue": "^2.6.13",
"vue-server-renderer": "^2.6.13"
"@faker-js/faker": "^7.6.0",
"@nuxt/module-builder": "^0.2.1",
"@nuxt/schema": "^3.0.0",
"@nuxt/test-utils": "^3.0.0",
"@nuxtjs/eslint-config-typescript": "^12.0.0",
"@types/node": "^18.11.18",
"@vitest/coverage-c8": "^0.26.2",
"@vue/test-utils": "^2.2.6",
"eslint": "^8.30.0",
"eslint-config-prettier": "^8.5.0",
"eslint-plugin-prettier": "^4.2.1",
"eslint-plugin-vue": "^9.8.0",
"happy-dom": "^8.1.1",
"nuxt": "^3.0.0",
"playwright": "^1.29.1",
"prettier": "^2.8.1",
"vitepress": "^1.0.0-alpha.33",
"vitest": "^0.26.2"
}
}

@@ -1,58 +0,76 @@

# nuxt-multi-cache
# Nuxt Multi Cache
SSR page, component and data cache for Nuxt. Supports purging cache entries by key or by cache tags.
Ultimate caching for Nuxt 3.
**[Installation](https://nuxt-multi-cache.netlify.app/guide/setup)** - **[Documentation](https://nuxt-multi-cache.netlify.app)** - **[NPM](https://www.npmjs.com/package/nuxt-multi-cache)**
- SSR component caching (caches rendered markup of a component)
- Route caching (pages, API routes)
- Data Caching (generic cache for anything)
- CDN cache control headers (e.g. Cloudflare, Fastly, Varnish)
- API for cache management
- Cache tag based invalidation
# Concepts
- **Cache:** Page, component and data with support for cache tags
- **Purge:** Using cache tags or by key
- **Pick:** Enable only what you need
- **Manage:** REST API for purging and getting stats about the caches
**[Documentation](https://nuxt-multi-cache.dulnan.net)** - **[NPM](https://www.npmjs.com/package/nuxt-multi-cache)**
# Example
# Features
## Cache a page with cache tags
## Component caching
Use the `<RenderCacheable>` wrapper component to cache the markup of the
default slot:
```vue
<template>
<div>
<h1>Welcome!</h1>
<RenderCacheable cache-key="navbar_de" :max-age="3600">
<Navbar />
</RenderCacheable>
</div>
</template>
```
<script>
export default {
asyncData({ app }) {
return app.$api.get('article', { id: 10 }).then(article => {
app.$cache.route.setCacheable()
app.$cache.route.addTags(['article:10'])
return { article }
})
},
The component is only rendered once and its markup cached. Afterwards the
markup is directly returned.
data() {
return {
article: {}
}
}
}
## Route caching
Cache rendered pages or custom API responses:
```vue
<script lang="ts" setup>
useRouteCache((route) => {
// Mark the page as cacheable for 1 hour and add a cache tag.
route
.setCacheable()
.setMaxAge(3600)
.addTags(['page:2'])
})
</script>
```
## Purge a cached page
## CDN cache control headers
```bash
curl -X POST -i \
-H "Authorization: Basic YWRtaW46aHVudGVyMgo=" \
-H "Content-Type: application/json" \
--data '["article:10"]' \
http://localhost:3000/__nuxt_multi_cache/purge/tags
Manage the cacheability for the current response. This will set the correct
cache control and cache tags headers for Cloudflare, Fastly and other cache
providers:
```vue
<script lang="ts" setup>
useCDNHeaders((helper) => {
helper
.public()
.setNumeric('maxAge', 3600)
.setNumeric('staleWhileRevalidate', 21600)
.set('mustRevalidate', true)
.addTags(['page:2', 'image:342'])
})
</script>
```
# Warning
Caching is hard. You should be aware of the risks and potentially huge security
issues that may arise when caching an entire page.
The state is managed inside the current request and can be changed for the
entire duration of the request. The headers are generated right before the
response is sent.
Always make sure to never cache anything with content restricted to
authenticated users. Else you may leak sensitive information to anonymous
users.
## API
The optional API provides endpoints to manage the caches.
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc