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:
onSubmit = (e: JQueryEventObject) => {
e.preventDefault();
let $form = $(e.currentTarget);
$.ajax({
type: $form.attr("method"),
url: $form.attr("action"),
data: $form.serialize()
})
.done(() => {
//do something
})
.fail((e) => {
if (e.status == 400) {
$(".js-form-wrapper").html(e.responseText);
this.wireUpControls();
} else {
//handle error
}
})
}
And wire it up on initialize with: $("#your-form").submit(this.onSubmit);