Reacts role in the frontend and architecture

[saolof]

I was wondering a few things about the architecture that isn't clear from the docs:

1. The components are all rendered in the backend right? And only the VDOM is sent to the frontend to be diffed by react?

2. Reacts only role is to provide basic DOM functions? Does it use anything that isn't provided by preact?

3. From a security perspective, can I assume that all state lives in the server and only the VDOM nodes are ever sent, similar to Phoenix Liveview? This is my main reason to consider this library over a javascript SPA frontend.

4. How are the events and views sent? Persistent websocket wss + https connection? It follows basic security guidelines for websocket connections such as in this post to prevent CORS right?

(regarding 3, replacing react with preact could be a good way to reduce the JS bundle size)

[Archmonger]

I'll provide TLDR answers:

1. Pretty much. There's a few extra things occurring to facilitate that though.
2. Yes, but we use Preact instead of ReactJS. It is primarily used for updating the client DOM.
3. Yes. To oversimplify, all things Python stay in Python. Python creates the VDOM trees and keeps track of hook states. The front end is used to display the rendered results.
4. All ReactPy communication currently occurs via websockets. When an event is triggered, the client notifies the server that an event has occurred. That event gets handled by the registered Python event handler. For efficiency, this process only occurs if you registered an event handler in ReactPy for that event type.
   • For cross-framework compatibility, we lean on the user to know how to properly secure their ASGI application. This configuration needs to be done within your ASGI webserver, within your framework's configuration settings, and sometimes within reverse proxies like Nginx.
   • ReactPy will automatically use an encrypted connection if available.

[rmorshea]

I slight clarification, we use WSS if the page was served via HTTPS.