Marcel Schramm

Asciinema Support For My Blog!

Written on 3 February 2025 by Marcel Schramm

I often want to have console output in my blogposts. Since I don't want to upload videos, due to their size, I just create code boxes.

However, I thought it'd also be cool to use asciinema, but I didn't want to rely on their servers. Thankfully you can embed the player JS and selfhost the files!

While the API is a bit awkward, as you manually have to inject the components into `div` elements, it does work like a charm.

To embed an asciicast into a blogpost, all I have to do now, is this:

<asciicast src='/media/demo.cast' />

Which is then automatically turned into this:

This partially happens at generation time and partially at runtime. The goal is to avoid loading any additional JS or stylesheet if possible.