I am creating a website that displays market data for 500+ items in a video game. On the Vue application, moving to the market page was almost instantaneous and worked perfectly. Eventually I decided to transition the project to use Nuxt because it's said to be faster and has a lot of quality of life changes. After doing this loading the market page took 300 ms every time you switch over to it and felt slow. I went into the nuxt.config.ts and added ssr:false. The moment I did this the page went back to loading in around 100 ms.
Another issue was an animation that slides down a dropdown menu when you open it became laggy the moment I switched over to Nuxt even though it is the exact same code.
Why is the SSR much slower than CSR? I'm brand new to Nuxt so maybe there's something I'm doing wrong? I'm considering ditching Nuxt and going back to plain Vue because Vue seems to be much more clean and easier to debug and has much much less dumb issues that come out of nowhere.
Thete is no specific reason to use Nuxt for performance. Nuxt should be used when you need SSR, either for SEO, faster initial load time, server capabilities or anything related.
Nuxt comes with default like preloading, code splitting per page etc...but it also introduces a new thing: needing to have your code working on both client side and server side. Most of the time some Vue code is not directly compatible with the server side of things. Some hydration mismatch for example can cause a lot of issues. And that's not the only thing that can introduce slow downs if you do not account for the context shift of client + server. Some full app with only dynamic parts of a game might not be that useful overall for an SSR approach.
Given we do not have any specific benchmarks with a specific part of the app showcased, it's hard to pinpoint exactly what is wrong. Nuxt should be faster but you mostly can do everything by yourself.
TLDR: Nuxt most of the time makes things faster. In some cases, it doesn't make sense.