`+hooksTimeout`

Environment: client, server

type HookTimeout = {
  error?: number | false
  warning?: number | false
}
type HooksTimeout = false | Record<string, HookTimeout>

Local

Provided by: vike

If a hook returns a promise that takes too much time to resolve, then Vike logs an error and your error page is rendered.

# Vike first logs a warning (still awaiting your hook)
[vike][Warning] The data() hook defined by /pages/movies/+data.js is slow: it's taking more than 4 seconds

# Then Vike logs an error (and renders your error page)
[vike][Error] The data() hook defined by /pages/movies/+data.js timed out: it didn't finish after 30 seconds

You can configure the timeout of hooks:

// +config.ts
 
import type { Config } from 'vike/types'
 
export default {
  hooksTimeout: {
    data: {
      // Increase warning timeout to 5 seconds
      warning: 5 * 1000,
      // Increase error timeout to one minute
      error: 60 * 1000
    }
  }
} satisfies Config

Disable

You can disable timeouts:

// +config.ts
 
import type { Config } from 'vike/types'
 
export default {
  hooksTimeout: {
    data: {
      // Disable the warning timeout
      warning: false
    }
    // No timeout at all: Vike won't warn and will indefinitely await the
    // promise returned by onRenderClient()
    onRenderClient: false
  }
} satisfies Config

⚠️
We strongly discourage this practice:

You may always want to be informed when one of your hooks is slowing down your UI.

Showing an error page is usually a better UX than displaying a UI that hangs indefinitely.

If your server doesn't time out long running HTTP requests, then you have a memory leak. Instead, consider increasing timeouts as the need arises.

You can also disable timeouts for all hooks:

// +config.ts
 
import type { Config } from 'vike/types'
 
export default {
  // We strongly recommend against this
  hooksTimeout: false
} satisfies Config