Today, November 2, 2021, marks 20 years since the domain NOVALISTIC.com was first registered, originally by my dad in support of my big brother for his personal website. To this day I don’t know how my brother came up with the name… but it’s unique, it’s (somewhat) pronounceable^{1 2}, and it’s got a certain timelessness that appeals to me. Which is why I was more than thrilled to take it so I could say I had my very own online domain name at the age of just ten, two years after first learning HTML at the age of eight (two years is a long time when your age is still a single digit!).

The fact that its first three syllables happen to be exactly the same as the name of a planet in the first Ratchet & Clank game that came out the same year I took ownership of the domain is merely the icing on the cake!

You’d think a lot could’ve happened in 20 years. Well, a lot did happen, but not the kind of “a lot” you might expect. But still — in the interest of not being overly introspective in what is meant to be a quick commemorative post and an update of what’s going on — what my site has been through over the last two entire decades, what I’ve been through growing up together with the site, is pretty bittersweet to look back on.

From my brother’s teenage whims when he first owned the domain, then my eclectic childhood whims that made NOVALISTIC 1.5; up to my better-developed, standards-compliant personal online space in NOVALISTIC 2.0; past what NOVALISTIC 3.0 “Oltanis” aspired to be; through BoltPress 2.0 followed by a bona fide professional portfolio in NOVALISTIC 4.0 “Sarathos”; and back to my roots in NOVALISTIC 5.0 “Veldin”, where I can be my most authentic, personal and passionate self… it’s been, indeed, unquestionably a lot, even if I know due to my own insider knowledge there could’ve been so much more. And so I don’t want to beat myself up too much over it. Instead, what I have is an opportunity to congratulate myself on going through all this, iterating and learning, and doing it all with God even in the years before I knew Him personally.

The last day of this month will be the 6th anniversary of NOVALISTIC 5.0 “Veldin”. This version of the site never actually reached my original vision for it, and indeed has evidently been falling into disrepair over the last couple of years.

Someone reached out to me through my contact form just last month inquiring about the LEGO Room, which shows that people are still interested in my site and what I do. So, tough as it’s been for me, this month I will honestly, definitely, wholeheartedly make a renewed best effort to update my site again. The web platform and the technologies underpinning it have changed tremendously in such a short time (and “short” here is not the memetic exaggeration of the passage of time people have liked throwing around over the course of the pandemic), which means I’ll even have to re-learn certain things. I’d have to do so sooner or later anyway… so I might as well start with the safest space that is my own website, and start this month so I’ll be at a decent pace once 2022 comes around.

What this means is that, before the end of the year, my site will look pretty different beyond the home page (which will itself see one noticeable but not at all radical change). In fact, different enough to probably warrant a 6.0 version number (in time for the 6th anniversary) and a new codename… but it’ll match the original vision I had, thereby finally bringing 5.0 “Veldin” to a sort of finished state. You know what I mean; no need for additional comments to clarify, I won’t be approving those for the sake of reducing clutter.

I can’t really say I’m excited for this change; I don’t think “excited” is quite the right word for it due to the season I’ve been going through. But I’m feeling cautiously optimistic about it, and I can also feel my motivation creeping back in, and all I need now is for it to stay. I want my site to be the best it can be. And I want to show myself that I can do the work to make it happen. After all, I already did the work to make what you’re seeing right now happen. And I can do more.

See also, on this day last year: :where(:is(#daniel.now))

I presented my first ever CSS talk.

And I wasn’t alone in giving a talk today. I would have my turn… right after Eric Meyer.

Timestamps, courtesy of Makyen:

1. 19:25 for Eric’s talk, Design in the background. Or watch separately via Engineers.SG.
2. 58:48 for my talk, Introducing :is() and :where(). Or watch separately via Engineers.SG.

Before I get to the part about me, some brief thoughts on Hui Jing’s and Eric’s sharings:

• I was utterly gobsmacked when the emoji Hui Jing used for my talk title (as she always does with talk titles) turned out to be 🐙. How did she know the octopus was my favorite marine animal?! At the end of my talk she said it was a guess. Georgie, who thought it was my doing, said it was a “damn good guess” (her exact words), and I have to agree.

• Before the event even started, I was secretly hoping that the CSS color of this month would be rebeccapurple, in honor of Eric. And well, I totally called it. And it was spectacular, wonderful and bittersweet at the same time. I’m sure a few heartstrings were pulled — I know mine was. There’s a reason I use it here on NOVALISTIC.com, too, which I’m super happy I got to tell Eric himself in as direct and personal a manner as this.

• I was there when Eric unveiled his site redesign, Hamonshū, after CSS Naked Day 2020 (which I participated in as well!). He would publish an article as well about the background effects he implemented, so it came as no surprise, I said, that he’d develop a talk about it. That’s not a bad thing; it was great to be able to listen to him speak about it and get a visual insight into the process. Even if I was somewhat preoccupied with trying to keep my nerves (in fact, throughout both Hui Jing’s and Eric’s segments I was constantly talking to Georgie privately in the Zoom meeting chat)…

• I’d like to extend my utmost gratitude to not only Hui Jing but also Eric and the rest of the audience for allowing me extra time to calm down until I was ready to share my screen and start talking, during which time Hui Jing shared some fun facts about me and dove into a chat with Chris, as filler. Thank you all for your patience, which you continued by my request in the first slide of mine you saw!

So, getting to my talk now. Why the sudden decision to put together a presentation on PowerPoint about Selectors, my favorite thing? Because of this:

While it was super cool that we actually managed to get Eric to share with us, it was the last part of the tweet that had me shook: “this wind-up edition”. That’s right: Talk.CSS #56 was going to be the last ever Talk.CSS (meetup in this format, anyway).

You see, after I started speaking for the first time at Talk.CSS #46 at the beginning of the year, I had written this footnote:

You might be wondering why I haven’t made the obligatory “putting the ‘talk’ in Talk.CSS” quip… that’s because I’m not ready to give a full-on talk just yet. But maybe someday! I’m mostly just not comfortable being recorded (something Engineers.SG is really efficient at by the way). Much rather a written article were shared.

And since I hadn’t been attending Talk.CSS all year (except in March), this would be my only chance to present a talk at Talk.CSS, before the curtain call. So I had only a little over a week to acquire equipment, think of a topic, put together said PowerPoint presentation, and practice. And I only managed to do all but the last one.

But I guess it didn’t matter that I didn’t get to practice, because I didn’t need it. In my very limited experience with presentations (due to anxiety and selective mutism), and my extensive experience answering questions on Stack Overflow, I’ve always known that I was a decent presenter, and I just needed the right, limited audience to feel safe and comfortable speaking. Presenting virtually on a Zoom conference was another great way to get me comfortable as well.

I told Georgie, as well as the other Stack Overflow mods (mostly because Samuel happened to have been a regular attendee), and some folks from church. And they came to support me, alongside Hui Jing, Chris, and Eric. I shout these folks out at various points in my talk.

So… I have, indeed and at last, put the ‘talk’ in Talk.CSS. And I had the utmost honor of having Eric Meyer listen to my very first talk. I’m glad people learned something new from it.

I only <tongue-in-cheek>regret</tongue-in-cheek> the following misses:

• I didn’t get to say “NOVALISTIC” out loud. (Wait, did I at the final slide? I actually don’t remember.)
• I didn’t get to reference the title of the previous blog post.
• My playful flexbox diss was supposed to be addressed to “flexbox fans” rather than the “flexbox users” I actually said.
• I mentioned that I might’ve used the color rebeccapurple somewhere in my slides. Turns out the only slides I did use it in had been cut. Oops.

Lastly, if you’ll indulge me, a couple of screenshots of the event page for posterity before its layout goes through the typical archival metamorphosis:

Strictly speaking, the selector in the title should’ve been simply :where(#daniel.now), and better yet it could’ve been :where(#daniel:current), but these wouldn’t have made for grammatical titles. Besides, you are allowed to nest :is() in :where() anyway. My only regret is that it overflows the Live Tile on my home page.

This is also not the announcement that the Stack Overflow community may have been awaiting ever since I stated my intention to publish one last September.

Hey there. How are you doing? I hope you are well.

The COVID-19 outbreak has thrown everyone for a loop in both direct and indirect ways, and (I’m sure you and) I have been no exception. I’m happy to report that I have not caught the virus (Singapore has handled it well, for certain definitions of “well” I won’t get into), and will take utmost care to keep it that way.

My plan, as outlined in my birthday post for the year, was described thusly:

In the short term (i.e. sometime this month) I plan to update my battlestation with my biggest incremental update to Radiance yet. Beyond that I will continue to work on the updates to the LEGO Room that I mentioned last year, as well as miscellaneous housekeeping elsewhere on my site.

But in general, I will be taking things slow. I wish I didn’t have to, but right now I have to if I want to keep it together for a little longer, and to be clear it’s still a nice thing to be able to do, not something I’m reluctantly settling for. Talk to you later.

That biggest incremental update to Radiance yet actually happened. Praise God! However due to world-changing events that took place soon after, I never got to work on the LEGO Room. I’m still actively pursuing my LEGO hobby, but I just haven’t had the energy to also update the site along with it. Furthermore, in March a new version of the Brickset API was released, with the current version on which my site depends no longer functional as of this writing. This has not broken the LEGO Room in any way, but it has prevented me from updating my collection until I finish upgrading it to the new API. That is indeed in progress but, for obvious reasons, will take a while.

Having said that, I have indeed been taking things slow; in fact, slower this year than any other year. I’ve been focusing my time on recuperating mentally at home, and navigating the “perilous” new normal outside world as it slowly reopens. I’ve been playing plenty of video games (the then-newly released DOOM Eternal actually saved me from a crisis, believe it or not, and remains one of my favorite games of the year). I wrote only a single technical article (not counting Talk.CSS #46) and it was about JavaScript, and have left my site pretty much dormant and been nearly completely inactive on Stack Overflow. I even stepped down as a Microsoft MVP and am now in the MVP Reconnect program.

And I suspect I will continue to take things slow for the foreseeable future. But I’ll be at Talk.CSS #56 tomorrow after months of not attending, and it’ll be a big one for me. Maybe I’ll see you there.

This wasn’t a performance-critical context, but nevertheless I started to wonder if every() would immediately return false as soon as it found an element that didn’t meet the condition, and some() would immediately return true as soon as it found an element that did meet the condition.

MDN states that they do, but I wanted to see some numbers. So I ran a handful of quick n’ dirty tests in the Firefox console to check it out. For the sake of organization, here’s the setup:

function bench(label, test, loops) {
    loops = +loops || 10;
    let t = [];

    for (let i = 0; i < loops; ++i) {
        let tt = performance.now();
        test();
        t.push(performance.now() - tt);
    }

    let avg = Math.round(t.reduce((a, b) => a + b) / loops);
    console.log(`${label}: ${avg}ms avg of ${loops}`);
    return t.map(Math.round);
}

const a = [1, 1, 1, 1, 1, 1, 1, 1], b = [0, 0, 0, 0, 0, 0, 0, 0];
const isEqualToOne = n => n === 1;

Here are the tests:

bench('every() is true', () => {
    for (let i = 0; i < 10_000_000; ++i)
        a.every(isEqualToOne);
});

bench('every() is false', () => {
    for (let i = 0; i < 10_000_000; ++i)
        b.every(isEqualToOne);
});

bench('some() is true', () => {
    for (let i = 0; i < 10_000_000; ++i)
        a.some(isEqualToOne);
});

bench('some() is false', () => {
    for (let i = 0; i < 10_000_000; ++i)
        b.some(isEqualToOne);
});

Here are the relevant computer specs:

• Windows 10, version 1909 (build 18363.720)
• AMD Ryzen 7 2700X (8 cores, 16 threads, tests running at 4.0 GHz via Precision Boost 2)
• 16 GB DDR4-3200 RAM

And here are the results in Firefox 74.0:

every() is true: 1501ms avg of 10
every() is false: 1382ms avg of 10
some() is true: 1339ms avg of 10
some() is false: 1459ms avg of 10

It looks like there is indeed a difference, albeit a small one. Specifically,

• Array.prototype.every() returns false 7.9% faster when the first of 8 elements doesn’t meet its condition, than it returns true for all elements; and
• Array.prototype.some() returns true 8.2% faster than it returns false, in similar circumstances.

I wanted to see how the results compared in other browsers, so I attempted to run these tests in both the new and legacy versions of Microsoft Edge, as well as Chrome. In doing so, I discovered that V8 and Chakra appear to cache function calls after the first couple of iterations, causing subsequent iterations to clock far shorter times and invalidating the output of bench().

Frustratingly, there does not appear to be a way to disable this behavior, so I had to significantly decrease the iteration count using the loops parameter I just happened to have had the foresight to include. I also had to decrease the number of calls to every() and some() in Edge Legacy and increase it in the new Edge and in Chrome to get reasonable times.

Here are the results:

• Edge Legacy 44.18362.449.0:

  every() is true: 2451ms avg of 3
  every() is false: 1897ms avg of 3
  some() is true: 1811ms avg of 3
  some() is false: 2488ms avg of 3
  

• Edge 80.0.361.69:

  every() is true: 467ms avg of 2
  every() is false: 153ms avg of 2
  some() is true: 154ms avg of 2
  some() is false: 424ms avg of 2
  

• Chrome 80.0.3987.149:

  every() is true: 465ms avg of 2
  every() is false: 153ms avg of 2
  some() is true: 156ms avg of 2
  some() is false: 428ms avg of 2
  

(Yes, I really did have to limit it to just 2 iterations in V8 before it started caching.)

The difference appears significantly larger in Chakra at 22.6%/27.2% faster, and is just ridiculous in V8 at a whopping 67%/64% faster. It’s not immediately clear to me why when I compare the source implementations, so perhaps someone more familiar with the code might be able to shed some light? It doesn’t help that the SpiderMonkey and ChakraCore implementations are literally just JavaScript, so it’s got to be something way under the hood. But here are the links anyway:

• SpiderMonkey: https://github.com/mozilla/gecko-dev/blob/master/js/src/builtin/Array.js#L84
• ChakraCore: https://github.com/microsoft/ChakraCore/blob/master/lib/Runtime/Library/JsBuiltIn/JsBuiltIn.js#L591
• V8: https://github.com/v8/v8/blob/master/src/builtins/array-every.tq and https://github.com/v8/v8/blob/master/src/builtins/array-some.tq

All told, since I was just writing a userscript for Firefox, which is my daily driver, for personal use, I’m not too worried. But I did learn a thing or two about Array.prototype.every() and Array.prototype.some(), more than I bargained for, and I thought it might interest other JS performance junkies, which is why I’ve blogged about it. Hope you learned from it, too.

So I went to Talk.CSS today, the first of the year. This time it’s at Microsoft Singapore’s new office at Frasers Tower. It would be my first time there after my last visit to the old office for last year’s Insider Dev Tour, so I was pumped.

But this being a new environment, I had to take precautions to ensure things went as smoothly as possible. To that end I pinged Hui Jing and Gao Wei on Twitter:

And then I had the brilliant idea of going through Sarah, my Microsoft MVP contact from Microsoft Singapore, as well. It would be my first time meeting her in person. She said she’d pick me up after finishing her meeting; I couldn’t go inside so I waited at the lobby for her.

Turns out, when I first got to the lobby, I was so calm that I could confidently decide to tweet this to the former two:

That’s right: even before I’d set foot in the new office, my selective mutism was already a no-show. This could have partly been because I made it a point to be early so I had time to collect myself, but I’m serious, it’s all Microsoft. My 11 years of guaranteed speech at the old office appear to have carried over seamlessly.

Anyway, Sarah came to pick me up first; it would be another 10 minutes before Hui Jing got there. Naturally, she was the first person I spoke to.

And here I was, at Microsoft Singapore’s new office at Frasers Tower:

Read on for Hui Jing’s reaction to hearing my voice for the first time and, of course, the talks themselves! I know the talks are probably what you came here for but this experience was particularly important to me so I just had to share. Let a disabled person have their limelight, won’t you?

While it was still just me, Hui Jing and Sarah, with the former getting things ready and the latter about to head downstairs to check in attendees, I walked up to the former, showed her that second tweet, then said Happy new year, because she had first greeted me with the same. Immediately she beamed — in silence, but my point is that she beamed. And as people started coming in, I was able to keep speaking to her, even with others in earshot this time.

Finally, it was time for us to be seated and for the talks to start. With Sarah sharing this Microsoft Docs page on CSS in Microsoft Edge DevTools, I felt silently (heh) important as a Microsoft Edge and CSS MVP. I just wish I could’ve strutted my stuff like I did at the Insider Dev Tour, but I wanted to let a lady have her limelight! (I didn’t take any more photos of the talks after this one.)

After Sarah finished her quick sharing, it was time for announcements. Engineers.SG, as usual, coming in hot with recordings available before the end of the day so you can watch it right now (and, if you’re new to SingaporeCSS, listen to all the Singlish goodness):

My non-Microsoft main boy Firefox shipped two new releases since the last Talk.CSS, whose release notes you can find below:

• Firefox 71 for Developers
• Firefox 72 for Developers

Something intriguing and something groan-worthy from the announcements which I also highlighted on Twitter:

Then came the actual talks. First up was Ryan from TeamSpirit who gave a very fascinating (and probably eye-opening!) presentation on how culture permeates and shapes web design and user experience around the world. There were stark comparisons between American, Chinese and Japanese versions of several major websites, and an important closing message of diversity in teams.

Next, a talk by Sathish Kumar Thiyagarajan on why user experience makes a great product.

And finally, Murray who’s spoken about math previously returns with something less math-related. It’s to do with inaccessible email newsletters, specifically the horrific use of text in images where it doesn’t belong, and another sobering reminder that our pleas for accessibility still aren’t getting taken seriously, especially by the powers that be.

Some particularly captivating content today which made the day even better. I’m glad. But what I’m most proud of, really, is my personal breakthrough. I was speaking at Talk.CSS¹ for the first time since I started attending it a year and a half ago. No doubt selective mutism will continue to affect me (because disability doesn’t just go away after a single breakthrough), but I’m really curious now if I’ll end up continuing to speak at future Talk.CSS meetups. There were several missing faces today who therefore haven’t had a chance to hear my voice yet and I’m nervous if I’ll be able to speak to them next time I see them. Only time will tell. (Yes, Gao Wei did eventually get to hear my voice too by the end of today.)

There was just one problem before we even got started with the event though: the food. You see, Talk.CSS often gets us pizza, which is all and well, except I can’t eat pizza from most places. It’s not a dietary issue; it’s an accessibility issue. I’d rather not talk about it on here, but let’s just say that the vast majority of food of all kinds is completely inaccessible to me, and hardly for dietary reasons. Thin crust pizza in particular gives me a very hard time. But I tend not to blame anyone for this — you can’t accommodate every single person at all times, and mine’s an extreme edge case, even among disabled folks.

But Sarah offered to help me search the office for utensils I could use. And when she couldn’t find any, she went down to a bakery just to get me something I could eat (since baked goods are some of the only accessible foods to me, and the pizza was right about depleted by now), and she’d cover the cost. And when she realized she wasn’t carrying any cash for one bakery she went to a second one. All while I sat in for the talks. Thank you so much, Sarah! Thanks for taking extra care of your guests/MVPs.

And Hui Jing, don’t worry too much over the event food. We’ll… think of something.