Custom wysiwyg editor. using streams to update preview on each stroke, is that bad?

Hi. Hope you’re having a good day. So i’m busy building a custom wysiwyg editor. It’s custom to our needs that’s why i’ve opted out using trix or something like it.

So. Before i was doing all the conversion by writing Stimulus controllers that handled the unique token and replaced it with something prover. However, i just migrated to using turbo.

Basically is on every keystroke i send a request to a controller that will render some stream that will update the preview.

You can see the youtube video to see what i’m saying

I was wondering. Would this be bad in a production environment?

This is the main method in the Stimulus controller that is responsible for drawing it on the client-side. Just to illustrate what i’m trying to evade here


Yes, I think it might be a bad thing to do in production. You’ll be sending several requests per second for a single user and with a few users doing that at the same time you might DDOS yourself. Just imagine using the backspace key to delete a whole paragraph. Debouncing the keystrokes might help but it’d impact the UX you currently have which feels pretty snappy.

I think you’ll need to rethink your strategy. Maybe sync the text only on the front end with stimulus and save stuff in the back end with the debounced keystroke request with an empty response?

1 Like

You could even leverage the two techniques at the same time. Keep the UI in sync with stimulus, save with debounced keystrokes, update UI from the BE when inserting the coupons