Issue № 13: Shade of the Lime Tree

Rashad My talk “Hypermedia-Driven Web Apps in Haskell” has been accepted by the Houston Functional Programmers User Group. I’ll be giving the talk in September. This talk will be great for not only Haskell users, but any web developer who would like to integrate htmx + more data-driven development or functional programming ideas into their web application code.

The star of my presentation is “Function Based Views” (Django jargon […]) and why it works very nicely with htmx. A web app designed in this manner is basically a composition of simple functions with the type : toHypermedia : SomeDataType -> Hypermedia
🎊 5 👑 3

Rashad Wait until you see the hyperscript quasiquoter in the works…Haskell will be able to verify the syntactic validity of your hyperscripts…At compile time (the best time)!

<button
  class="text-lg bg-blue-500"
  _="on click increment :x
      if :x <= 3
        put :x into the next <output/>
      else
        put '3 is the max...' into the next <output/>
      end"
>Click Me</button>
<output>--</output>

becomes

myButton = do
  button_
    [ class_ "text-lg bg-blue-500"
    -- Below is a quasiquotation in Haskell. Parsed at compile time,
    -- so we can check for syntax errors.
    , [__|
        on click increment :x
          if :x <= 3
            put :x into the next <output/>
          else
            put '3 is the max...' into the next <output/>
          end
      |]
    ]
    "Click Me"
  output_ [] "--"

Some doubletexts have been merged

1cg i think we should go back to one file man

1cg one big ol javascript file. maximum contrarian. lets do it. c’mon

Deniz Akşimşek but scrolling is so tiring

1cg tab switching is worse! one, single, glorious, insane file, it speaks to me

…

Deniz Akşimşek ok. compromise: we will make each plugin be one module

…

Deniz Akşimşek what is our goal for browser support btw?

1cg hyperscript or htmx?

Deniz Akşimşek hyperscript

1cg modern browsers – all browsers - IE

Deniz Akşimşek how modern, can we depend on import

1cg we can talk beyond that

1cg caniuse: [Image: Can I use modules?] not awful

1cg y tho when we can have one big file 🤌

Deniz Akşimşek

<script type="module">
import _hyperscript from "https://esm.sh/hyperscript.org"
import eventsource "https://esm.sh/hyperscript.org/eventsource"
_hyperscript.use(eventsource)
</script>

1cg I guess I can live with that

Deniz Akşimşek if we can depend on ES modules i can finally fix workers

1cg 😑 I’m willing to take a look at it.

1cg how did I get from “one file” to “es modules” in ~5min? 😑

Deniz Akşimşek es modules are the simplest

1cg … next to…

Deniz Akşimşek making sure the right global variable is there sucks. ordering script tags correctly sucks. (function() { ... })() what the fuck is this

1cg 100% agreement there

gnat es modules bring their own layer of complexity and barrier to entry tbh.

one file + no build step = anyone can jump in and get context without setting up a build system. less moving parts.

The cost of removing simplicity is always difficult to forsee the consequences of because were all so ready to use the new shiny…

gnat Carson has been around long enough to see so much tech come and go… he’s super well in-tune for keeping it anti-hype, anti-layer.

Its this exact reason so many of us love htmx and hyperscript.

Its why they will stand the test of time.

Deniz Akşimşek Explain how es modules add complexity over something like UMD

gnat sadly es modules require a server environment because of CORS.

(function() { ... })() just works man, even from plain .html files directly off your drive.

that’s a big advantage: A new dev from the orange site can download hyperwordle.html and actually tinker with it.

playing with real hyperscript is IMHO the quickest way to make a new user-- Getting to that point needs to be friction free: the language is already different enough!

It’ll be detrimental to the growth of the language for new users to get hung up on CORS shit.

gnat That said, didn’t mean to come off as harsh, you’re an amazing contributor dude.

Deniz Akşimşek i guess the real problem is that the hyperscript codebase is aging and i’m just trying to compensate

h*ckraiser666 fairly new to both go and htmx; do you guys unit test your html template files? coming from stuff like react, unit testing your components is par for the course. wondering if there are some strategies for server side templates too

TardisX I do 🙂 With the proper abstractions it’s quite easy. I am doing simple regex based checks of content output, but you could use something like goquery if you needed to do DOM traversal style stuff as well.

3Dayo I tend to use goquery far more in my tests than regex

h*ckraiser666 oh interesting. I’ll check that out

benpate Ashamed to say “no” I don’t really unit test my templates. At some point, front-end testing gets hard because presentation is so subjective.
But, I’m thinking I probably could (ok, should) make some tests where I pass in different values and guarantee that the templates don’t error out.

benpate Goquery is awesome and underused 🙂

Deniz Akşimşek microformats are the answer to everything.

Deniz Akşimşek put your html through a microformats parser then test the output data

Deniz Akşimşek i don’t think you can test a template in isolation, you need to test the endpoint that renders it

benpate Ok, who does this college kid think he is, and why are his answers always correct?

benpate I have been working microformats into my latest templates. They are spiritually similar to htmx – walking the full circle from computer-readable HTML -> human-readable HTML -> then back again to computer-readable.

Deniz Akşimşek there’s something very philosophically pleasing about humans and API clients using the same source of truth

Deniz Akşimşek 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