具有增量静态再生 (isr)
next.js 中的 增量静态再生 (isr) 提供了一种强大的方法来结合 静态和动态 内容的最佳内容。通过启用静态内容更新而无需重新创建整个站点，isr 允许以更具可扩展性和更高效的方式处理页面。我们可以显着减少服务器负载，处理大量内容，并确保用户看到最新信息，而无需等待所有页面完全重新生成。
我们可以更新静态内容，而无需重新创建整个网站。我们可以通过为大多数请求提供预渲染静态页面来减少服务器负载。我们可以在下次创建时间较长之前处理大量内容页面。
让我们从一个例子开始 :
export const revalidate = 30export const dynamicparams = true // or false, to 404 on unknown pathsexport async function generatestaticparams() { const posts = await fetch('https://jsonplaceholder.typicode.com/posts/').then((res) => res.json() ) return posts.map((post) => ({ id: string(post.id), }))}export default async function page({ params }) { const post = await fetch(`https://jsonplaceholder.typicode.com/posts/${params.id}`).then( (res) => res.json() ) return ( {post.title}
{post.content}
)}
这个例子是如何工作的？
对这些页面（例如/post/1）发出的所有请求都会缓存且即时。 30 秒过去后，下一个请求仍将显示缓存的（陈旧）页面。 缓存失效，新版本的页面开始在后台生成。生成成功后，next.js将显示并缓存更新后的页面。如果请求 /post/12，next.js将按需生成并缓存此页面。
如果您需要更高的精度，可以使用按需重新验证，但如果您需要实时数据，请考虑切换到动态处理。
使用 revalidatepath 进行按需重新验证
next.js 允许您手动清除特定页面或路由的缓存。也就是说，当某个内容更新时，您不必重新创建所有页面，而只能重新创建更改后的页面或内容。
您希望页面发生变化时（例如添加新帖子时）立即更新，可以使用 revalidatepath 函数触发此过程。换句话说，只要向用户添加新内容，您就可以让新内容立即出现。
'use server'import { revalidatepath } from 'next/cache'export async function createpost() { // invalidate the /posts route in the cache revalidatepath('/posts')}
使用 revalidatetag 进行按需重新验证
next.js 应用程序，它允许您通过标记某些数据或内容来手动清除其缓存。这用于在特定内容更改时清除该内容的整个缓存。当内容更新时，用户看到的是最新的数据。
export default async function page() { const data = await fetch('https://api.vercel.app/blog', { next: { tags: ['posts'] }, }) const posts = await data.json() // ...}
然后您可以使用 revalidatetag :
'use server'import { revalidateTag } from 'next/cache'export async function createPost() { // Invalidate all data tagged with 'posts' in the cache revalidateTag('posts')}
创建静态导出时不支持isr。如果静态渲染的路由中有多个获取请求，并且每个请求都有不同的 revalidate 频率，则 isr 将使用最短的时间。然而，这些重新验证频率仍将受到数据缓存的尊重。如果路由上使用的任何获取请求的重新验证时间为0，或者明确的无存储，则该路由将动态呈现。 中间件 不会针对按需用户请求执行，这意味着中间件 中的任何路径重写或逻辑都不会应用。确保您重新验证确切的路径。例如 /post/1 而不是重写的 /post-1。
结论
isr 是内容频繁更新但不需要完全动态渲染的项目的最佳解决方案。然而，在优先考虑实时数据的场景中，切换到动态处理可能更合适。
如果你喜欢我的文章，可以请我一杯咖啡:)
以上就是Nextjs：增量静态再生（ISR）的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1494145.html
微信扫一扫 
支付宝扫一扫 
