scripts

It’s almost like they are trying to see how much more bullshit can they put in a browser before it breaks.

—Никита Прокопов, JavaScript Bloat in 2024

JS is often misused, adding complexity where not needed. And oftentimes it hinders rather than enhances the browsing experience. While it may be required to interact with a web app, it shouldn’t prevent you from reading a simple article.

There’s also a lack of transparency in that the average user is oblivious as to what the various scripts in a website are doing. So here are the ways JS is used in this site.

index

On the homepage, a script goes through the index items and tags items that have been updated within the past week with the class name recent. This adds a small “+” to the item.

tooltips

Tooltips are sprinkled throughout. They appear on mouseover and follow the cursor.

e.g. Hover over me

<span data-tip="Hello!">Hover over me</span>

Tooltips are currently available for <abbr> and <time> elements, and footnotes.

time

Time elements can be hovered over to show the elapsed time span since their timestamps. This could also be displayed as part of the copy. Time is formatted according to browser locale using Intl, e.g. 2022-08-18 (

You have JavaScript disabled

)

<time datetime="2022-08-18T08:23:11Z">2022-08-18</time>
<output class="t" data-time="2022-08-18T08:23:11Z"></output>

numbers

Numbers are displayed according to browser locale using Intl, e.g. 1234.5789

<v-n>1234.5789</v-n>

names

Sometimes I want to only display a person’s surname for stylistic reasons but don’t want to make it too vague. Like if I mention Swift, I could be referring to the famous writer Jonathan Swift or some tailor of Lilliputian note. Hover over names to reveal their full forms, e.g. Josh Avanier

<p-name><f-name>Josh</f-name> <l-name>Avanier</l-name></p-name>

This is experimental. There are cases of foreign names where the first and last names are swapped, middle names, honorifics, and where a form of a name with some abbreviation is the most widely used, like John Ronald Reuel Tolkien.

stories

The Atelier uses OpenStories by ddddddddʣzzz, which I first saw on Mu-An Chiou’s site. What it does is it renders a Instagram Story-esque slideshow element that shows you the 50 most recent images in the atelier (parsed from a JSON feed), as an alternative quick and cursory glance at what you may have missed. I might keep or remove this; still feeling it out.

mathml

At this time, the MathML notes page uses MathJax to render formulas. I was going to integrate MathML throughout the site, particular in the worldbuilding sections, but some rendering inconsistencies between browsers made me fall back to just using pseudocode for now. This might change if support for MathML improves.

misc

Some pages have inline scripts that feature Easter eggs, which I won’t spoil here as that would the defeat their purpose. Rest assured, they’re all harmless.

compatibility

All JS features and Web APIs I’ll use in this site are ones compatible with and tested on the latest stable releases of Firefox and Vivaldi on Debian. I care not for other pedestrian browsers and operating systems. This page will be updated accordingly as the scripts evolve.