Mr Speaker

mrspeaker's head in a monitor You find yourself at the entrance to the Hompage of Mr Speaker. In a darkened corner sits a trunk containing HTML5 games and some JavaScript tidbits. Next to it you spy a ■■■■■■■ account. Exits are North, East, and .

And… goodbye JavaScript!

When I de-bloated my piece of the web, I noted that the largest asset I was serving on my blog was a local version of jQuery - coming in at some 70+ kilobytes - that "I still need to insert into the head of my page for historical reasons: 15 years ago I in-lined lots of my wacky JavaScript experiments".

But things change: we are now in the middle of a bloat-a-demic. Web sites are tracking and expanding far beyond sustainable levels... and emergency measures must be taken.

So I have done the unthinkable. I have pulled the plug on JavaScript on my blog. All of it. Now the total number of network requests (not counting any images inside of posts) comes in at six (6):

  • / : 35k
  • style.css : 7.7k
  • mrman-up.jpg : 43k
  • mrspeaker.png : 17k
  • mrman.jpg : 43k
  • favicon.ico : 1.5k

And `mrman.jpg` and `mrman-up.jpg` are the same image, flipped vertically - so I should certainly lose one of them. 1.5k for a favicon seems a bit hefty - I should check that. And I did some more tweaking of my old php software and made the html output prettier and leaner, but I'm sure there's more to improve in there too.

Naturally, "no scripts" means my wacky JavaScript experiments have been killed dead… and that simply can not stand. I'll commence the long process of de-jquery-fying them and making them run stand-alone (mostly they were just using JQuery for the `$(document).ready` anyways).

But it feels pretty good to go cruft-free. Having dropped the kilobytes (down originally from around 5Mb (!) to around 200k for a full page of posts) I feel like a whole new webmaster. A giant weight has been lifted.

Until the next big web trend comes along, of course.

Monads for Babies

Monads for Babies is the first in a series that teaches computer science to toddlers. It's only available in digital form at the moment (png format, embedded below), so I suggest `right-click -> print` so you can read it to the lil' tigers at bed time:

Support my Patreon if you'd like to see more.

A most useful function

Hot on the heels of my web colors rant, comes this amazing piece of Emacs Lisp I now have in my init file:

(defun web-color ()
  (interactive)
  (let ((cols '("AliceBlue" "AntiqueWhite" "Aqua" "Aquamarine"
     "Azure" "Beige" "Bisque" "Black" "BlanchedAlmond" "Blue"
     "BlueViolet" "Brown" "BurlyWood" "CadetBlue" "Chartreuse"
     "Chocolate" "Coral" "CornflowerBlue" "Cornsilk" "Crimson" "Cyan"
     "DarkBlue" "DarkCyan" "DarkGoldenRod" "DarkGray" "DarkGreen"
     "DarkKhaki" "DarkMagenta" "DarkOliveGreen" "Darkorange" "DarkOrchid"
     "DarkRed" "DarkSalmon" "DarkSeaGreen" "DarkSlateBlue" "DarkSlateGray"
     "DarkTurquoise" "DarkViolet" "DeepPink" "DeepSkyBlue" "DimGray"
     "DodgerBlue" "FireBrick" "FloralWhite" "ForestGreen" "Fuchsia"
     "Gainsboro" "GhostWhite" "Gold" "GoldenRod" "Gray" "Green"
     "GreenYellow" "HoneyDew" "HotPink" "IndianRed" "Indigo" "Ivory"
     "Khaki" "Lavender" "LavenderBlush" "LawnGreen" "LemonChiffon"
     "LightBlue" "LightCoral" "LightCyan" "LightGoldenRodYellow"
     "LightGray" "LightGreen" "LightPink" "LightSalmon" "LightSeaGreen"
     "LightSkyBlue" "LightSlateGray" "LightSteelBlue" "LightYellow" "Lime"
     "LimeGreen" "Linen" "Magenta" "Maroon" "MediumAquaMarine" "MediumBlue"
     "MediumOrchid" "MediumPurple" "MediumSeaGreen" "MediumSlateBlue"
     "MediumSpringGreen" "MediumTurquoise" "MediumVioletRed" "MidnightBlue"
     "MintCream" "MistyRose" "Moccasin" "NavajoWhite" "Navy" "OldLace"
     "Olive" "OliveDrab" "Orange" "OrangeRed" "Orchid" "PaleGoldenRod"
     "PaleGreen" "PaleTurquoise" "PaleVioletRed" "PapayaWhip" "PeachPuff"
     "Peru" "Pink" "Plum" "PowderBlue" "Purple" "Red" "RosyBrown" "RoyalBlue"
     "SaddleBrown" "Salmon" "SandyBrown" "SeaGreen" "SeaShell" "Sienna"
     "Silver" "SkyBlue" "SlateBlue" "SlateGray" "Snow" "SpringGreen"
     "SteelBlue" "Tan" "Teal" "Thistle" "Tomato" "Turquoise" "Violet"
     "Wheat" "White" "WhiteSmoke" "Yellow" "YellowGreen")))
    (insert (nth (random (length cols)) cols))))

Calling it with `M-x w-c` (from anywhere you care to type things) injects a random entry - so you get a wonderful rainbow of weird names, instead of forgetting them all every time and just choosing "lemonchiffon".

Debugging has never looked so good.

Olive vs OliveDrab

"Name as many of the web 'X11 color set' named colours as you can." should be the new fizz buzz. I think I'd do pretty good, but would always fall down on the "mediums" and "lights". "MediumPapayaWhip? LightRosyBrown?".

If it were in an interview situation, I could talk for hours about the faded glory of LemonChiffon, the unexpected practicality of PeachPuff, the eerie strangeness of Thistle, and the deep beauty of Orchid (way better than MediumOrchid, which I'm pretty sure is one of the mediums).

But I'd be praying they don't ask my opinion on Olive and OliveDrab.

Olive is way more drab than OliveDrab. It's drabber. There's no competition. If I showed you you'd 100% agree, but I categorically refuse to put the drabby drabby drabness that is "Olive" on this website. I JUST WON'T DO IT! OliveDrab should be renamed to OliveFestive or something, and I'm not moving until it had been changed in the CSS specification, and maybe even added to as as the honorary 17th named color in the HTML4 specification.

Well, nah, maybe it's not that good. And it is a bit drab I suppose. But drabber than Olive?!

Anyways, did I get the job?

Graybeard

Thanks to a decreased demand in shaving recently, I discovered several grey facial hairs. It's happening - I'm becoming a graybeard!

The timing is suspicious: I start using Emacs, I turn into a graybeard.

But did Emacs cause me to get grey hairs, or did the hairs coerce me into to using Emacs?

It Just Works ™

My favourite marketing phrase in all of computers is "It Just Works". It unwittingly represents nearly all of software engineering. It just works. Only just.

The absolute minimum.

(Side note: my favourite marketing phrase in sports and fashion is "Just Do It". If you have to do it, only just do it.)

JavaScript’s Numeric Separators

During a particularly-late night coding session, I accidentally discovered that JavaScript now has "numeric separators". What started as a simple test in my browser console: `dx=100+xo`, would be drailed by a typographical error that revealed a hidden secret…

`dx=100_`

As I depressed the underscore-instead-of-plus key, Firefox's auto-evaluator-thingy sprang into action and warned: "Uncaught SyntaxError: underscore can appear only between digits, not after the last digit in a number".

Despite my tiredness, and my usual tendency to not read error messages, it caught my eye… "an underscore can do what?" I murmered. Tentatively I added another digit to the assignment: `dx=100_0`. Hitting enter, console informed me that `dx` now had the value of 1000!

I tried some other values: 1_000_000, 1_1_1_1_1, 0xff_ff_ff… all worked - the underscores disappear and you're left with a regular ol' number! After a quick duck-duck-go I discovered that this fancy feature was called Numeric Separators and is currently in stage 3. Also, obviously, it's already implemented in Firefox (I'm on 78) - but I think Chrome too.

I'm going to dig in and see what else is coming through the TC39 pipeline… there's probably 1_000_000 other things I've missed.

document.designMode?

You learn something new every day. Today I learned about insect reproductive systems, and also that document.designMode is a thing. Both seemed pretty interesting, but only the latter let's you make any text on any web site "editable".

Open up the dev console and type document.designMode="on", and marvel as you can type over any text on a page (you even get spellcheck in Firefox). Setting document.designMode="off" restores the page to a read-only mode more strongly sclerotized than a head or thorax. It's like contentEditable, but for everything.

I don't know how this feature managed to escape me for so many years: it was introduced a billion years ago in Internet Explorer, has been part of Firefox since (at least?) version 3, has full support pretty-much everywhere, and seems designed for singular purpose of pranking your office coworkers.

Just my luck to discover it right after offices stopped being a thing.

Blog-o-thon ahoy!

I hereby declare my intention to spam a whole tonne of blog posts in the near future.

I've made this declaration several times in the past - and never managed anything remotely close to "a tonne", but this time we find a confluence of important factors - contributing to a near-perfect storm.

A very-adequate storm.

  1. I just narrowly saved my beautiful domain name from certain extinction.
  2. I deleted my long-standing Twitter account - and now the words have no void into which to be sunk.
  3. I got addicted to Emacs, and therefore...
  4. I've automated creating and editing blog posts from within my text editor.

So expect a lot more quantity, a lot less quality, and a lot more grammar and spelling errors.