The form handlers are not attached when SSR is enabled

[lakshmajee]

I am using inertia.js with rails framework and adding ssr integration using inertiajs/server package.

I have created a simple form to save some data into the database. When I submitted the form it is always reloading the same page.
After debugging I came to know that, the event handlers for the form or any other input elements are not attached due to ReactDOMServer.renderToString.

How do I make my form submission work with SSR feature ?

Thanks in advance 🙏 .

Note: This is more related to universal rendering. How do we support universal rendering ? By using client-side and server-side inertia integration, it loads the components unnecessarily (twice - one in ssr.tsx and another in client.tsx).

// client.tsx
import React from 'react'
import { render } from 'react-dom'
import { createInertiaApp } from '@inertiajs/inertia-react'

createInertiaApp({
  resolve: name => require(`./Pages/${name}`),
  setup({ el, App, props }) {
    render(<App {...props} />, el)
  },
})

// ssr.tsx
import React from 'react'
import ReactDOMServer from 'react-dom/server'
import { createInertiaApp } from '@inertiajs/inertia-react'
import createServer from '@inertiajs/server'

createServer((page) => createInertiaApp({
  page,
  render: ReactDOMServer.renderToString,
  resolve: name => require(`./Pages/${name}`),
  setup: ({ App, props }) => <App {...props} />,
}))

Lets assume a component name Hello.tsx is requested by server (rails or laravel whatever), then Hello.tsx is loaded by ssr.tsx on the server to generate static HTML markup and client.tsx on the browser (again). Thus it causes performance bottleneck.