In 2023 I decided I wanted to spend more time reading and more time writing. What better way to kick that off than with a book review? We’re starting the year with Hypermedia Systems, a work in progress book that focuses on extending hypermedia for a better web app experience, without having to resort to single page applications and JSON APIs as far as the eye can see. Unfortunately, since this book is still a draft, I had to mostly read the HTML version on my phone. But overall, this book inspired me and encouraged me to embrace hypermedia rather than fear it.

This book will likely be an outlier from the rest of the books that I read, as well – this book is entirely open source.

Key Takeaways

  • By embracing hypermedia, we can reduce complexity significantly by not needing to manage application state in both the server and the client.
  • HTML and HTTP were both built explicitly for hypermedia, but HTML falls short in a few critical ways that result in javascript frameworks gaining popularity.
  • By addressing four core limitations of HTML, we can create applications that feel modern and snappy, without needing to resort to entire single page applications.
    • By making any element capable of issuing an HTTP request
    • By making any event capable of triggering an HTTP event
    • By making all the different types of HTTP methods available
    • By making it possible to target any element in the DOM for replacement.
  • REST does not mean “a bunch of JSON APIs” – in fact, REST originally explicitly required the exchange of hypermedia, NOT the use of just JSON APIs.
  • Separation of concerns can lead to more complicated systems that are harder to understand, whereas focusing on locality of behavior results in easier to understand and thereby easier to maintain code.

What I Liked

  • The book walks through the development of a simple contacts app, Contact.app, to explain concepts and show how to implement what is being talked about.
  • The book is free and accessible, so I was able to freely share it with several developer friends.
  • I found the underlying subject matter inspiring in its simplicity.
  • There were many references to useful resources that I haven’t previously read, which means I can follow up more on the things I was interested in.

What I Didn’t Like

  • Becaues the book is only available in HTML right now, I wasn’t able to easily make highlights on instapaper without adding every section to my instapaper first. It turns out that there is the whole book as one html file, I just didn’t see it until I was finished and writing this review. A pdf/epub version I could read and highlight on my kindle or remarkable.
  • The reading experience on mobile was a little frustrating at times because certain links didn’t really work the way you’d expect them to. For instance, I don’t think I could load this page as anything other than the raw html while reading from my phone.
  • There were a number of typos throughout that were a little distracting, but hey – its open source, we can just open a PR to fix those.

HTMX, Hyperscript, HyperView have me feeling Hyper

As I read through this book, I was also working on a small habit tracking application for myself and decided to use this as an opportunity to embrace hypermedia instead of falling into the react trap. I was skeptical that it would really feel as nice as a react app typically does, but much to my surprise, I was basically one attribute away from a revolutionized web experience.

Enter hx-boost.

hx-boost is an attribute that can be applied to the body of your html, and it will automatically cause all of your links to be “boosted”, which basically means that the requests are made via javascript and then the body of the page is replaced, but not the whole head tag. This means no re-parsing javascript, no re-parsing css, etc. It removed that unwanted flash of white that is so common with server-side rendered pages.

This caused me to really start to dig into it more, and I am happy to be putting Hyperscript, HTMX, and HyperView on my 2023 list of technologies to work with.

Hyperview

Hyperview is a fascinating construct to allow us to build native mobile apps that still embrace hypermedia as the form of exchange. It uses react-native to interact with the device, and exchanges HXML, which is basically an XML format specifically for rendering applications on mobile devices. I haven’t used it much yet, but I am eagerly looking forward to turning my habit tracking app into a mobile app for my phone with it. I hope it lives up to the hype from the book.

Hyperscript

Hyperscript is a fascinating approach to javascript workflows. It uses a near-english syntax that is designed to be embedded directly onto HTML elements, further facilitating the locality of behavior. I’ve only written a few lines of hyperscript so far, but it was just as easy as outlined in the book.

Final Thoughts

Reading this book really encouraged me to try to embrace simplicity and avoid all of the shiny new things and complicated frameworks out there. I realize there is a certain irony in that, since each of these things are their own new things. But something about HTMX, Hyperview, and Hyperscript is just inspiring. I’ll be looking for any way to shoehorn these philosophies into my development at work.