1st week of 2021

Published on

Scheduling vacations like a pro, tail call optimizations, uncontrolled form inputs in React, and more.

Table of contents

👨‍💼 Work

Returned from vacation + protip

Returned from a 2-week Christmas vacation on Thursday. On the remaining two days, I catched up on emails and investigated poorly performing database queries.

Protip: try to schedule your vacations so that you return in the middle of the week. This way the first work week will be more pleasant as it will be a short one. I learned this some years ago from my colleague (thanks, Joonas!).

👨‍🚀 Personal

Website tweaking

Tweaked my website (changelog). Also started this weekly log!

👨‍🎓 Learnings

Regular expressions: consuming characters

I am (update: was) writing a blog post about how to convert an URL path into "cumulative segments" in JavaScript; e.g. '/foo/bar/baz/' into ['/', '/foo/', '/foo/bar/', '/foo/bar/baz']. While writing it, I learned that:

  • When a regular expression matches a part of a string, it consumes those characters. This prevents doing overlapping matches, but this can be circumvented by using lookbehinds or lookaheads.
  • String.prototype.match() ignores capturing groups when using the global flag (g), but String.prototype.matchAll() does not.

JavaScript: Assignment operators have return values

Another thing that I learned while writing the blog post (mentioned in the previous section) is that assignment operators have return values. For example, these two functions are effectively the same:

() => {
return (foo += 10)

() => {
foo += 10
return foo

Chrome DevTools' Performance tab

My colleague gave a 10-minute introduction to Chrome DevTools' Performance tab. I admittedly haven't used it much, but now I know a couple of things to look for there (thanks, Jukka!).

(I don't have any tips to share for now, but searching "chrome devtools performance tab" on DuckDuckGo will probably yield good results.)

Tail call optimization

Learned about tail call optimization (TCO) by watching Tail Call Optimization: The Musical!! on YouTube (found it via a comment on Hacker News). It was funny but informative! My quick notes:

  • Tail call = a function call at the very end of a function, i.e. the function call has to be the very last thing that the function does.
  • Tail call optimization (TCO) = if the language (and engine) supports TCO, tail calls are removed from the call stack because they are kind of unnecessarily there (because of the tail position).
    • Pro: You don't get errors saying "Maximum call stack size exceeded" (Chrome) or "Too much recursion" (Firefox).
    • Con: Stack traces have less information (because tail calls have been removed from the call stack), making debugging errors potentially more difficult.
  • Not in the video but relevant: ECMAScript 6 offers TCO, but TCO "isn't supported by many [JavaScript] engines and that may never change." Source: Tail call optimization in ECMAScript 6 by Dr. Axel Rauschmayer

🕵️‍♂️ Cool stuff

Sam Selikoff's Work journal

Sam Selikoff's Work journal is nice. It's what inspired me to start this weekly log!

Uncontrolled form inputs in React

Using uncontrolled form inputs in React (a tweet by Josh W. Comeau) – "No fussing with state required."

I always thought that using untcontrolled inputs in React is very rare or even a bad practice, but it makes sense to use them if the input values are needed only for the form submission. See also the tweet replies for shorter variants.

💁‍♂️ More Weekly log entries

Next week: 2nd week of 2021