Slow initial page load on vercel with nuxt3

362 Views Asked by At

I have a question about slow initial loads on vercel for my nuxt landing pages. It seems that once in a while I have a really long load time on the home page of my website. Almost all the load time comes from the https://* url.

I have noticed in the request that the following request is carried out: X-Nitro-Prerender:/api/_content/query/oXVcX8nCZd.1697526020655.json

And that I always have a cache miss: X-Vercel-Cache: MISS

Could these be the reasons my intial page load is slow? How would I solve this?

Here is my nuxt.config.ts:

import dynamicRoutes from './helpers/dynamicRoutes'

export default defineNuxtConfig({
    devtools: {enabled: process.env.NODE_ENV !== 'production'},
    modules: ['@nuxt/image', '@nuxtjs/robots', '@nuxtjs/tailwindcss', '@funken-studio/sitemap-nuxt-3'],
    routeRules: {
        '/**': {prerender: true},
        '/blogs/**': {ssr: true}
    },
    nitro: {
        prerender: {
            crawlLinks: true,
        }
    },
    sitemap: {
        hostname: 'https:/<>',
        cacheTime: 1,
        routes: dynamicRoutes,
        defaults: {
            changefreq: 'daily',
            priority: 1,
            lastmod: new Date().toISOString(),
        },
    }
})

And here is my vercel.json:

{
  "redirects": [
    {
      "source": "/dashboard/:path*",
      "destination": "https://<>/dashboard/:path*",
      "permanent": true
    },
    {
      "source": "/account/:path*",
      "destination": "https://<>/account/:path*",
      "permanent": true
    },
    {
      "source": "/login/:path*",
      "destination": "https://<>/login/:path*",
      "permanent": true
    }
  ]
}

I use the default settings for nuxt.js in vercel for building my pages.

Does anybody have any idea how to solve the initial page load time?

1

There are 1 best solutions below

0
On

I have moved to the following route rules:

routeRules: {
        '/blogs/**': {ssr: true},
        '/': {isr: 60},
        .
        .
        .
        '/features/**: {isr: 60},
    }

This makes sure my pages are cached. The cache misses was the reason my site sometimes loaded slow. I have also removed the '/' rule, because it seemed to conflict with the 'blogs/' rule and instead wrote every page or group of pages seperately.