251–256 of 256 posts
Thank you for putting your code out in the public so I can learn from it!
This is fantastic. Right now in my PWA I'm using a little library I created called `html-form` (HTMF) and I need to implement it as a SPA to avoid service worker fetching on every page change. So, I used a similar attribute to `hx-select`. But it adds quite a bit of code to the code base. Using your pattern I can remove all that added code and I can stop using hash navigation. Nice and simple. Thank you for putting y…
So, it seems like this pattern could probably take you quite a ways. But the main issue I have is that you would need to parse all that JS out twice by the browser. But if you don't have the need for any `script` tags in what you pass back it would be pretty nice.
Also, it wouldn't work for graceful degradation as the server wouldn't know if you need the whole page or a segment. As HTMX adds a header that lets you know that JavaScript is being used by the front end.
Overall, I think it is really cool and it would be neat to see how far you could take this.
Zero noscript fallback. Please don't use this.
You can easily add no-js fallback by setting base target in JS instead of HTML. Then append e.g. `?fullpage` to HTML elements and remove this query param with JS. With no JS, links will open in the same window with `?fullpage` query param, which return a full page from the backend instead of a fragment.
Earlier quoted context omitted.
Yeah it breaks without JS. You could add the iframe behind JS, so the target would default to a new tab. But the server would still be designed to return HTML fragments. I never found a way for a server to check if the originating request is for an iframe or a new tab. It's not quite a graceful degradation.
There is a new request header: `Sec-Fetch-Dest: iframe`
I just added an example using Sec-Fetch-Dest
https://github.com/Kalabasa/htmz/commit/6ad3a76be3ee755bb5e7...
Earlier quoted context omitted.
You can easily add no-js fallback by setting base target in JS instead of HTML. Then append e.g. `?fullpage` to HTML elements and remove this query param with JS. With no JS, links will open in the same window with `?fullpage` query param, which return a full page from the backend instead of a fragment.
A commenter above mentioned that when you target an `iframe` it sends back the header `Sec-Fetch-Dest: iframe`, so if it doesn't have that then you know it requires the full page and not the snippet. So, yes, easy no JS fall back by dynamically adding the `base` tag. Nothing else needed.