Issue № 8: Hyper Media Presence
Blogs Corner
Daniel, A Tour of myPrayerJournal v3: Conclusion
The thrilling conclusion to the Prayer Journal Pentalogy.
When I say “simplicity,” I am speaking of a lack of complexity, not a naïveté of approach.
Daniel - East TN BTW - I can’t remember who said they weren’t sure about writing about their code publicly. But, whoever you are, in this post I actually talk poorly about my own code. 🙂
Daniel - East TN They can’t talk bad about you if you beat them to it! LOL
Daniel - East TN
If you’ve made anything with htmx/_hyperscript, please share it! It’s lovely to hear from you. 💙
https://blog.bitbadger.solutions/2021/a-tour-of-myprayerjournal-v3/conclusion.html
Dave Syer, Client Side Development with Spring Boot Applications, Spring Blog
HTMX is a library that allows you to access modern browser features directly from HTML, rather than using javascript. It is very easy to use and well suited to server-side rendering because it works by replacing sections of the DOM directly from remote responses. It seems to be well used and appreciated by the Python community.
https://spring.io/blog/2021/12/17/client-side-development-with-spring-boot-applications
Arham Jain, Building a simple typing test website using hyperscript
I’m not claiming that hyperscript will replace Javascript, but it is very interesting to use. The strangest thing about this project was that I found it slightly more difficult to write code, but much easier to read my code back.
What we believe in. 💙
https://arhamjain.com/2021/12/18/hyperscript-simple-type.html
htmx on JavaScript Jabber podcast
Check out this week's episode of #JavaScriptJabber with Carson Gross @htmx_org. Come to know all about the pros and functions of HTMX and InterCooler.
#JSJ: HTMX and InterCooler
<https://rfr.bz/t3i5x11> <https://rfr.bz/t3i5x11>
https://javascriptjabber.com/htmx-and-intercooler-ft-carson-gross-jsj-513
_hyperscript on devMode.fm podcast
🎙 devMode podcast episode 123: "Hype for Hyperscript" 🌟
@gaijinity & guest host @ben_pylo talk with @htmx_org & @DenizAksimsek about their web scripting language Hyperscript & why the world really does need another scripting language! #webdev #frontend
https://devmode.fm/episodes/hype-for-hyperscript
The new _hyperscript Cheatsheet
Keeping all the features of event listeners, ways of finding elements, the intricacies of variable scopes and the syntax of every single command just a glance away — the _hyperscript cheatsheet!
Fubarrr ↪ Re. CapnKernel That’s awesome! You’re awesome! Awww, shucks, thanks! Yes, I do indeed take full credit for the fact that there now exists a probably 90% complete Hyperscript Cheatsheet 😎. I mean, do you know how hard it is to create a whole Google doc from scratch, complete with title and single “TBC” line… and remembering (aka googling) how to share it so anyone can edit it?! To be fair, I guess a little credit should go to @Deniz Akşimşek for his very small contribution (although I did find it a bit cheeky of him tbh 🙄) of replacing my “TBC” line with 2 pages of actual cheatsheet content. Still, much like Edison is remembered for inventing the lightbulb, I shall go down in the annals of history as The Creator of The Hyperscript Cheatsheet ™
Avoid listening to htmx:load when you have big responses
Fubarrr Btw… remember that thing I said before about htmx swapping faster than intercooler? For some reason, if I’m swapping a bunch of
<option>elements into about 15 selects with htmx… the browser freezes for several secondsDecember 16, 2021, 6:21 PM UTC
Fubarrr Ok folks, so after @1cg and @Deniz Akşimşek had a look at the profiling… turns out that it’s our codebase that’s to blame for that crazy 7.2 s scripting time on page load ☝️ , NOT htmx 😁 🤦♂️
Deniz Akşimşek new htmx best practice just dropped: avoid htmx:load for responses containing large numbers of elements
How to submit an htmx form using JavaScript?
TL;DR: Use form.requestSubmit() instead of form.submit().
Deniz Akşimşek anyone who had trouble submitting an htmx form with JS: https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/requestSubmit
Wrt. the closest expression
1cg closest means “closest in parent hierarchy”: https://api.jquery.com/closest/
December 10, 2021, 5:34 PM UTC
c-nv-s hmm… I think the use of
nextmakes the same sense as it does in english, but notclosest.c-nv-s If I understand correctly, it’s meaning is more like equivalent (hierarchically speaking)?
c-nv-s …at least in my mind ‘closest’ usually has a spatial connotation
1cg I took the terminology from jQuery. Too baked into my mind at this point
1cg I could allow for a closest child
form, maybe Deniz Akşimşek ↪ Re. 1cg I took the terminology…
enclosingwould perhaps be a better name forclosestbenpate It would be. It’s the constant _hyperscript dilemma of choosing “natural language” vs. “what Javascript has already defined”. In this case, “closest” (although not a good natural language label) is already widely used.
Deniz Akşimşek it’s not that common
Fubarrr 37 billion jquery users would argue with you @Deniz Akşimşek 😁
Deniz Akşimşek most hyperscripters don’t use event delegation (they should) which is the main use case
Fubarrr (not an accurate number, but a close approximation, judging by the number of jquery questions/answer on stackoverflow)
benpate 🍿
Deniz Akşimşek generally if code affects a whole component it should either be at its root or send events that bubble there ☝️ 1
Deniz Akşimşek not reach out from a descendant to the root to manipulate it
Fubarrr That said… I have had to think hard about what “closest” means again more than once… I agree it’s ambiguous
Deniz Akşimşek
component
the framework brain worms are paying the old flowerpot a visit
What do you think about closest?
tables 🤮
1cg AHHHH
1cg that form tag isn’t legal
1cg it isn’t even in the dom I bet
1cg tables 🤮
tables 🤮