Nuxt•4w ago

Optimize Netlify deployment for Nuxt 3 + Nitro? (Serverless limits exceeded)

Hey, I just posted on Reddit about this, but maybe someone in here has any thoughts on this problem. I'm running a Nuxt 3 website deployed on Netlify using the Nitro server (built with pnpm run build). My current route rules are:

{
  "/**": { "prerender": true },
  "/api/**": { "ssr": true, "prerender": false }
}

{
  "/**": { "prerender": true },
  "/api/**": { "ssr": true, "prerender": false }
}

However, I’m exceeding the serverless function limits each month. The only API routes I’m using are: 1. /api/sitemap (via @nuxtjs/sitemap module) 2. /api/newsletter (simple POST request for a newsletter signup) So those two routes are not visited that much. From what I understand, every page visit might be triggering a serverless function execution—likely because I’m running the full Nitro server. My Questions: Would switching to Edge Functions make sense? Would this reduce function executions? And would setting SERVER_PRESET=netlify_builder in my .env be all I need to do? Are there other optimizations I should consider? The website does not update that frequently, so I put prerender: true because all sites can basically be static. I only need the newsletter signup function. Thanks in advance!

From the Nuxt community on Reddit

Explore this post and more from the Nuxt community

2 Replies

kapa.ai•4w ago

Hi @tierra. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Based on your situation, I can provide some recommendations to optimize your Netlify deployment for Nuxt 3 with Nitro. Understanding the Issue Your current setup is using Netlify's serverless functions for all non-prerendered routes. Even though you've set "/**": { "prerender": true }, the Nitro server is still running for each page visit, which is likely why you're hitting serverless function limits. Recommended Solutions 1. Use Hybrid Rendering with Proper Route Rules Your current route rules are on the right track, but you might need to be more specific:

{
  "/": { "prerender": true },
  "/**": { "prerender": true },
  "/api/newsletter": { "ssr": true, "prerender": false },
  "/api/sitemap": { "prerender": true }
}

{
  "/": { "prerender": true },
  "/**": { "prerender": true },
  "/api/newsletter": { "ssr": true, "prerender": false },
  "/api/sitemap": { "prerender": true }
}

This would ensure your sitemap is prerendered at build time (since it's likely static) while only the newsletter endpoint uses serverless functions Hybrid Rendering. 2. Consider Netlify Edge Functions Yes, switching to Edge Functions could help reduce your function execution costs. Edge Functions run on Netlify's CDN edge network and have different pricing models than traditional serverless functions. To use the Netlify Edge preset, you would need to:

// nuxt.config.ts
export default defineNuxtConfig({
  nitro: {
    preset: 'netlify-edge'
  }
})

// nuxt.config.ts
export default defineNuxtConfig({
  nitro: {
    preset: 'netlify-edge'
  }
})

Or set NITRO_PRESET=netlify-edge in your environment variables Presets. 3. Static Site with Isolated API Since most of your site is static, you could consider a different approach: 1. Use nuxt generate to create a fully static site 2. Create a separate, minimal API for just your newsletter functionality This approach is supported by the knowledge from Stack Overflow:

// nuxt.config.ts
export default defineNuxtConfig({
  nitro: {
    prerender: {
      crawlLinks: true,
      routes: ['/'],
      ignore: ["/api"]
    }
  }
})

// nuxt.config.ts
export default defineNuxtConfig({
  nitro: {
    prerender: {
      crawlLinks: true,
      routes: ['/'],
      ignore: ["/api"]
    }
  }
})

This configuration would prerender all your pages while keeping the API routes dynamic Stack Overflow Post. 4. Optimize Memory Usage If you're experiencing "JavaScript heap out of memory" errors during build (as seen in some Netlify deployments), you might need to increase the memory limit:

NODE_OPTIONS=--max_old_space_size=4096 nuxt build

NODE_OPTIONS=--max_old_space_size=4096 nuxt build

This can help prevent build failures on Netlify Github Issue. Conclusion Based on your needs (mostly static site with minimal API requirements), I recommend: 1. Use the hybrid rendering approach with specific route rules 2. Consider switching to netlify-edge preset for potentially better performance and cost 3. Make sure your sitemap is prerendered rather than generated on each request These changes should significantly reduce your serverless function executions while maintaining the functionality you need. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•4w ago

<@910553251949195276> Kapa.ai is still learning and improving, please let me know how I did by reacting below.

Gaming

Programming

Optimize Netlify deployment for Nuxt 3 + Nitro? (Serverless limits exceeded)

Did you find this page helpful?