RetroFed Forums
Your home away from modern life.
Use htmx more to create a more dynamic application
Post Reply
AuthorMessage
Rimu
piefed.social

rimu@piefed.social
Joined: 2024-01-04
Posted:   Subject: Use htmx more to create a more dynamic application Quote

Continue efforts to integrate HTMX, to help transform an old-school multi-page application into something more modern. Where feasible, anything that currently results in refreshing the entire page (such as changing the sort order, or adding a reply when in the post), should just refresh the relevant section.

1   Original
Rimu
Moderator

rimu@piefed.social
Joined: 2024-01-04
#2 Posted:   Subject: Re: Use htmx more to create a more dynamic application Quote Reply

As of 2023 we have cross-document view transitions: https://developer.chrome.com/docs/web-platform/view-transitions#cross-document_view_transitions. It's just a couple of lines of CSS, really easy. I added it a few months ago. Here's another blog post about it https://daverupert.com/2023/05/getting-started-view-transitions/

It mostly works although sometimes when a page has no scrollbar and the next page does have one the whole page gets re-rendered. There may be a way to improve this but I haven't tried.

Currently this is a Chrome-only thing but I hope Firefox adds support for it soon.

Here is a simplified demo: https://mdn.github.io/dom-examples/view-transitions/mpa/index.html. Note how the second page loads with no flash of white (on Chrome-based browsers).

For this reason I don't feel the need to use htmx for basic navigation but am very keen to use it for smaller-scoped pieces of UI

1
Andrew
piefed.social

andrew_s@piefed.social
Joined: 2024-03-27
#3 Posted:   Subject: Re: Use htmx more to create a more dynamic application Quote Reply

As of 2023 we have cross-document view transitions: https://developer.chrome.com/docs/web-platform/view-transitions#cross-document_view_transitions. It's just a couple of lines of CSS, really easy. I added it a few months ago. Here's another blog post about it https://daverupert.com/2023/05/getting-started-view-transitions/ It mostly works although sometimes when a page has no scrollbar and the...

Oh, right. That effect is a bit too subtle for me - I already use a chrome-based browser, and had to load up FireFox to tell the difference. Never mind then, I doubt this post will be in the Top 5, and this is mostly about me learning about a Shiny New Thing.

1
mesa
piefed.social

mesamunefire@piefed.social
Joined: 2024-12-27
#4 Posted:   Subject: Re: Use htmx more to create a more dynamic application Quote Reply

Htmx is so nice for my grug brain.

1
Post Reply
Back to top