Hey all. I’m enjoying the new library. I’m having a little trouble figuring out the patterns and best practices for structuring Turbo Frames.
From what I see, the most intuitive use case for a turbo-frame would be to decompose the application into the bits of the page that need to be reloaded by some other page action (such as a form submission). However, this partial-page replacement would still require a full page render: the HTML is loaded from the back end and the front end is what reconciles the two documents.
My question is around patterns that would make a turbo-frame the optimal choice over rendering a turbo-stream with a replace action.
My understanding is that turbo streams are made for more complex cases, where you need to do more than a simple frame replacement… Maybe add a new tag, remove another, update part of the document… one of these maybe all of them at same time
My experience is that <turbo-frame>s are really great if you want to make a title editable by clicking on it, or if you just want to load in something expensive a little bit later. However they quickly become hard to work with because they have unexpected consequences of things not loading or loading in the frame when they aren’t supposed to, or making the page look like it’s not doing anything because it doesn’t have the right <turbo-frame> in the response or not updating the URL properly. Usually it’s far better to just let turbo drive do it’s normal thing if possible.
I actually find that if I ever have to modify more than one thing on a page a <turbo-stream> (over HTTP) is far better and simpler. Just make sure you provide a way to do a full page load if needed.
Just my experience since using it on my side project.
In my case I use when I want to update parts of the page which are not in the close proximity and cannot be in the same frame. Also, turbo-streams are much more efficient from a size point of view as you only transmit what needs to be changed.
In my case - I’ve been testing this great thing for over a week. Turbo streams works wonderful if we need multiple actions on the same turbo stream template like replace couple of things around the page which are not in the same frame or close proximity. Also a note - that if you need to change things with templates for multiple users at once - you might need to use broadcast_replace_later_to, because just rending turbo stream template - it changes dom only for single user.