Debugging server routes with Node Inspector
Hi everyone 🙂 Currently I have a lot of heavy processing on my Nuxt Server API endpoints (Nitro /H3). I make calls to external API's and I chunk the promises to handle all of this.
The problem I have is currently I have a bottleneck somewhere down my code, but I can't seem to find the problem with just console.log,
How can I Debug my Nitro / Nuxt server endpoints with node inspect? I've tried nuxt --inspect but that seems to work only with the frontend side of Nuxt?? Correct me if im wrong.
I want to profile my nitro/h3 server to see where I have a performance bottleneck.
3 Replies
Hi @Vincentamus. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
You can debug and profile your Nitro/H3 server code in Nuxt with these built-in options:
- Enable sourcemaps and run the Node inspector for server-side debugging:
- In nuxt.config: enable sourcemaps if needed.
- Start dev with inspector:
nuxt dev --inspect (this attaches a Node debugger to the server; you should see the Node.js icon in Chrome DevTools) (Debugging and Debugging with Node Inspector).
- Use an IDE debug config to set breakpoints in server code:
- VS Code example launches “server: nuxt” (node) alongside browser, so you can step through server handlers while hitting your API routes (Debugging in Your IDE).
- Inspect server request lifecycle via Nitro hooks:
- Add a Nitro plugin in server/plugins and hook into events like request, beforeResponse, afterResponse to log timings around your handlers (Nitro App Hooks, Server directory / Nitro plugins).
- Use browser performance markers for Nuxt hooks (dev):
- experimental.browserDevtoolsTiming adds performance markers in Chromium DevTools Performance tab; useful to correlate SSR timing with your endpoints (dev default; can be disabled) (browserDevtoolsTiming).
- Leverage Nuxt DevTools for runtime visibility:
- Server Routes tab to test endpoints; Plugins tab shows plugin init time; Timeline/Inspect help find rendering/SSR bottlenecks tied to server work (Nuxt DevTools features, Nuxt performance – DevTools).
Notes and tips:
- The Node inspector attaches to the Nitro server in dev; it’s not limited to client code. Use it together with breakpoints in files under server/api or server/middleware (Debugging with Node Inspector, Server directory).
- For precise timings, wrap your heavy handlers with Nitro hooks or measure inside handlers and log durations before/after awaited chunks (Nitro App Hooks).
If you need to customize dev-only server behavior (e.g., add temporary handlers for profiling), you can register devServerHandlers in nuxt.config (devServerHandlers).
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@153776119345184768> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
@kapa.ai Maybe i'm understanding something wrong, but I did run the nuxt --inspect command, and I run the server route which I want to inspect, but I don't see any proccess or function of my own endpoint.
It's all Nuxt internals,
I'm doing something wrong?
