Well, you don't need a SPA to do that at all. You don't have to do the validation client-side, you can still get the server to do it with some extremely simple javascript.
You can render server-side, then switch it to an ajax post in javascript. On submit, post the form back in ajax (a simple `.serialize()`) and if there's a validation error in the form, return the HTML form back in the response with the validation errors and replace it in the DOM.
Virtually instant feedback, no page reload, no 30 second initial SPA load.
In ASP.Net MVC, for example, this is as trivial as changing the `Layout` property of the page in the controller, the full layout for GETs, no layout in POSTs.
Technically you don't even have to support progressive enhancement, but it's so trivial in most frameworks you may as well.
I believe Rails has a built in turbo feature which essentially does this and more.
Example ts code, though usually put more in to disable double clicks and add a loading spinner:
You can render server-side, then switch it to an ajax post in javascript. On submit, post the form back in ajax (a simple `.serialize()`) and if there's a validation error in the form, return the HTML form back in the response with the validation errors and replace it in the DOM.
Virtually instant feedback, no page reload, no 30 second initial SPA load.
In ASP.Net MVC, for example, this is as trivial as changing the `Layout` property of the page in the controller, the full layout for GETs, no layout in POSTs.
Technically you don't even have to support progressive enhancement, but it's so trivial in most frameworks you may as well.
I believe Rails has a built in turbo feature which essentially does this and more.
Example ts code, though usually put more in to disable double clicks and add a loading spinner:
And wire it up on initialize with: