4 ms·

What's the best way to handle having multiple frontend components respond to events from a single SSE connection from some parent node data provider? Ideally we

by jadbox 7mo ago

What's the best way to handle having multiple frontend components respond to events from a single SSE connection from some parent node data provider? Ideally we do not what many SSE connections within a page for each component.. right? Then what's the best practice to handle that single SSE handler on the server and frontend? If that makes sense...

amaury_bouchard 7mo ago
That's exactly what patch mode is designed for. You open a single SSE connection on a parent element with `mu-mode="patch"` and `mu-method="sse"`, and the server sends HTML fragments with `mu-patch-target` attributes pointing to whichever components need updating. One connection, multiple targets. The server decides which components to update on each event.
- jadbox 7mo ago
  I love this- I'll give it a spin. I'd really want web developers to start making websites again that can run without javascript, but it can feel like a SPA if JS is available. This has always been 'possible' but, in practice, it's a massive pain. uJS and HtmX could help to be the polyfill solution to make this possible. That said, I worry about Form elements being controlled by uJS to use a different REST method (like DELETE), and this would cause JS-free browsers to break.
  - amaury_bouchard 7mo ago
    Glad it clicks! On the progressive enhancement point, µJS is designed exactly with that philosophy in mind: standard links and forms work without JS, µJS just enhances them. Your concern about `mu-method="delete"` is valid. Without JS, the browser will fall back to the form's native method (usually GET or POST). The classic solution is the `_method` hidden field pattern: the form submits POST with a `_method=DELETE` field, and the server reads that field to route the request correctly. µJS doesn't need to implement anything special for this, it's a server-side convention

by jadbox 7mo ago

amaury_bouchard 7mo ago

That's exactly what patch mode is designed for. You open a single SSE connection on a parent element with `mu-mode="patch"` and `mu-method="sse"`, and the server sends HTML fragments with `mu-patch-target` attributes pointing to whichever components need updating. One connection, multiple targets. The server decides which components to update on each event.

jadbox 7mo ago
I love this- I'll give it a spin. I'd really want web developers to start making websites again that can run without javascript, but it can feel like a SPA if JS is available. This has always been 'possible' but, in practice, it's a massive pain. uJS and HtmX could help to be the polyfill solution to make this possible. That said, I worry about Form elements being controlled by uJS to use a different REST method (like DELETE), and this would cause JS-free browsers to break.
- amaury_bouchard 7mo ago
  Glad it clicks! On the progressive enhancement point, µJS is designed exactly with that philosophy in mind: standard links and forms work without JS, µJS just enhances them. Your concern about `mu-method="delete"` is valid. Without JS, the browser will fall back to the form's native method (usually GET or POST). The classic solution is the `_method` hidden field pattern: the form submits POST with a `_method=DELETE` field, and the server reads that field to route the request correctly. µJS doesn't need to implement anything special for this, it's a server-side convention