I have a list of links which is styled differently depending on their “read” status. Unread items are in bold for example. Clicking a link renders the item and marks it as read, so on subsequent requests to the list page the item renders correctly. However, clicking the back button from the item page shows a cached copy of the list page, where the item is still shown as unread.
I’m currently working around this using a stimulus controller which removes the unread class on click, but I was wondering if there was another way to accomplish this using just turbo? Can I force turbo to reload the affected item when the page is restored using the back button?
It’s kinda hard to tell what’s best without code examples, but in my limited experience I think it’s completely reasonable to use javascript to add/remove classes from the DOM like you do and not try to force every piece of interaction logic to the backend (Turbo). Although Turbo is the biggest part of the stack, Hotwire as a stack includes Stimulus for a reason.
But I may be atypical on these forums in that I use very few Turbo frames and use Stimulus quite extensively for small user interactions.
Disabling the Turbo previews is also a possibility btw. I ended up doing that and I’m using page transitions instead. It all depends what you want to do, I don’t think there’s an established best practice that covers every use case.