https://htmx.org logo
Powered by
# htmx-general
  • m
    We are still thinking about the right approach w/ oob stuff, etc. @User was thinking about it the hardest. Friday is an htmx/hyperscript day for me, so I will try to put some thinking in now. If you want to put a gist together w/ your thoughts we can all review it and give feedback
  • m
    for posterity:
  • l
    I'm being mega lazy here and should just try buuuutt.... does 
    hx-indicator
    work with `hx-boost`ed elements? I have 
    hx-boost
    on essentially the entire page, and want any boosted link to show a little loading indicator
  • h
    Yeah ditto last weekend was at a wedding, but I'm gonna poke at it this weekend
  • l
    (I'm testing this now by adding 
    hx-indicator="#loading"
    to my 
    hx-boost
    element)
  • l
    Ok, I did that and it just worked? I'm gonna submit a bug report, I don't think it's normal that a library just does what I want
  • l
    Where are the hoops I need to jump through!?
  • m
    i legitimately think that the fact that htmx is pretty simple actually hurts it in today's web dev world: you can't have three month courses on it, you can't have five year contracts to port from version 18.3.567.1a to 18.3.567.1b, etc.
  • t
    Quick, everyone start pretending this is really really difficult
  • a
    Hi all I am using 
    hx-trigger="every 2s"
    to reload a table, and it is a little jerky. Even when the contents of the table do not change, the table jerks every 2 seconds. If there is no data in the table I just display some text in a 
    <P>
    tag and that does not jerk. How can I make the polling of the table smooth?
  • m
    I think it's browser-specific, but i believe tables can flicker when re-rendering the whole thing. Can you do it as divs instead?
  • a
    Thanks. It turns out not to be HTMX's fault, or necessarily the browser's fault. I have an element in the table that I am rendering with timeago.js ( https://timeago.org/ ) . That rendering causes the jerkiness. I will see what I can do about that....
  • g
    compute some sort of hash for the data in the table and put it in an 
    <input type="hidden">
    , include that hash in the request with hx-include, on the server if the data hasn't changed return 
    204 No Content
  • g
    alternatively: do date formatting on the server
  • a
    Thanks for the suggestions. The problem with the first one is that I don't actually maintain state on the server, so I don't know when the data has changed. Maybe I could fix that but it would be non-trivial. I could do date formatting on the server - since I am polling every 2s I don't have to worry about the "time ago" timestamps getting out of date. My server code is in python and it turns out there is an implementation of timeago in python!
  • g
    You recompute the data on each request right? Hash it and compare the hash to the one sent by the client.
  • a
    Ah, now I understand. I might try that. I am not submitting a form in this request. But I could change the route that is polled to 
    /endpoint/<hash>
    .
  • g
    No form needed to add a query param
  • a
    Yep. This will be good as the computation is a bit expensive and I would rather not do it every 2s if I don't have to. Thanks again.
  • a
    I guess I still have to recompute the data each time, in order to compute the hash. But I don't have to send it to the client each time if it has not changed. Not sure if that is what I want to do. I will think about it. But it's good to have options!
  • h
    has anyone tried using nprogress or progressbar.js with htmx?
  • h
    something that's a little more than just toggling the indicator?
  • a
    You can use bootstrap's progress bar, or something like it. Just have your server update the progress amount each time it responds. Example here: https://htmx.org/examples/progress-bar/
  • h
    that example shows reloading automatically every 600ms
  • h
    I am thinking I probably want to hook into htmx:beforeRequest
  • h
    and htmx:afterRequest
  • h
    to toggle turning the progress bar on and off
  • g
    ???
  • m
    wat is this?
  • g
    vscode decided that my javascript needed a semicolon at column -2
1...647648649...1146Latest