https://htmx.org logo
Powered by
# htmx-general
  • b
    Do you mean it is not recommended to add the 
    hx-boost
    attribute directly on the body tag? (sorry if the question sounds absurd, it is just that i haven’t grasp exactly yet how 
    hx-boost
    was operating)
  • b
    I am just re-reading the docs about 
    hx-boost
    to better understand, but does 
    hx-boost
    always replace 
    <body>
    or does it take the closest 
    hx-target
    into account instead of 
    <body>
    when available?
  • b
    Or, sorry, replying to myself but it seems that it is right seeing what you said previously https://discord.com/channels/725789699527933952/725789747212976259/887046109342625862
  • b
    Thow it is not clear in the docs what the server should respond to boosted requests. If I read the discord history, it seems it should respond as a fragment with the whole body (in case 
    hx-target
    is not defined, because the body becomes the target), instead of the full HTML page. But you say also that "by accident", the parsing of HTML will ignore all the non-body stuff. Hence it would "fall in place" even if the server returns the whole page instead of the body right? I think this information could be added to the docs so that people know how to deal with boosted requests on the server. Like should they have two different endpoints for boosted vs non-boosted requests for the same resource, or should they have a templating logic to include only the body vs the full page? To me, 
    hx-boost
    really starts to make sense if the server does not have to do anything special in returns. It would allow being really close to what turbolink provides, by continuing to return full responses on the server and see the magic happens on the frontend (and have a nice fallback to plain page reloads when js is disabled).
  • l
    I think what you just described is the current behaviour (perhaps just not documented detailed enough)
  • l
    If you return the whole HTML page in a boosted request, only the 
    <body>
    contents will be used (and the whole body replaced)
  • l
    Which means, if you change the HTML to use boosted requests against a server which doesn't "speak" HTMX you get turbolinks-like behavior
  • b
    Do you think this is a "feature", or it just happens because of the implementation? (and so it might break tomorrow)
  • l
    You would have to ask @User but I'm pretty sure it is intended to be a feature
  • l
    I agree it is perhaps not clear enough, but it is "documented" here https://htmx.org/docs/#boosting
  • b
    Yes, we can ask for @User , because above, he is telling this :
    Copy code
    /contacts - returns the UI for all contacts, may check for HX-Request header to render without a layout
    So even if it is a feature, he recommends having a check on the 
    HX-Request
    to render with or without the layout, while this might not be necessary as the behavior would be the same if always returning the layout included version. And yes, it is kinda documented in https://htmx.org/docs/#boosting but maybe there should be a little more precision on what the server is expected to return (telling explicitly that a full page can be returned, and not only the body).
  • l
    I assume "without layout" means not the whole 
    <body>
    but just e.g. the 
    <div>
    with the contacts in and an approriate 
    hx-target
  • l
    Note that he said "may check" 🙂
  • b
    Yes, not super clear to me ^^. Let’s wait for his answer. Because on that occasion that means 
    /contacts
    would never return a full HTML page at all, and so would only be used for htmx ajax requests (and not for regular browser requests).
  • l
    I think it's pretty clear it is intended to be a generic boost, since the default target is 
    body
  • b
    Yes, that would make sense
  • m
    Hello, sorry, was away from the keyboard. So: boosting on the body works and is normal As you note, you can return the entire page content from the target URL and it will parse properly and just extract the content of the body. This was a happy accident, but I will ensure that this behavior does not change, as I have applications that rely on it. A cleaner approach, in my opinion, is to check for the 
    HX-Request
    header and only return the content, rather than the 
    html
    head
    , etc. Ideally this can be done in a generic filter, as with rails. With respect to the target of boosting, the default is the body. However, you can override this by placing an 
    hx-target
    attribute in a parent element of the DOM for links. Sometimes you have a situation where you have an inner UI (a div) that uses its own target, and then you must "reset" the target of boosted links in that div to body:
    Copy code
    html
<body hx-boost="true">
  ...
  <div hx-post="/whatever" hx-target="this">
      ...
      <a hx-target="body" href="/foo"> ... </a>
  </div>
</body>
  • m
    if you have a lot of links together you can pull that hx-target up the DOM to a parent
  • m
    a riff on splitting your API up into Data & Application components, and taking it further to adopt a hypermedia API for your app: https://htmx.org/essays/splitting-your-apis/
  • m
  • b
    > A cleaner approach, in my opinion, is to check for the HX-Request header and only return the content, rather than the html head, etc. Thanks for taking the time to answer. What do you mean by "content" here? Do you mean only the 
    body
    tag, or a more precise scoped 
    div
    around the central "component" of the page?
  • b
    (e.g. the 
    div
    containing the list of contacts to go back to your example)
  • m
    Copy code
    html
<html>
  <head>
   ...
  </head>
  <body>
    THE CONTENT
  </body>
</html>
  • m
    the stuff inside the body
  • m
    typically you would have a layout that looks something like this:
  • m
    Copy code
    html
<html>
  <head>
   ...
  </head>
  <body>
    {{content}}
  </body>
</html>
  • m
    and so if your server side environment allows it, you can render an endpoint without that layout, and return just the inner content that ends up in the body
  • m
    in rails:
    Copy code
    ruby
   render layout:none
  • m
    or something like that
  • m
    🙂
1...365366367...1146Latest