WebReflection

// WARNING: There's much more to know/do around hooks, and
//          this is just a simplification of how these work.

// shared references, updated
// per each hook invoke
let execution = null;
let current = null;
let context = null;
let args = null;

WebReflection

const If = expression => {
  let call = true, value;
  return {
    then: callback => Promise.resolve(value).then(callback),
    Then(callback) {
      if (call && expression) {
        call = false;
        value = callback(expression);
      }
      return this;

WebReflection

const {isArray} = Array;

const sync = async values => {
  for (let {length} = values, i = 0; i < length; i++) {
    const value = await values[i];
    values[i] = isArray(value) ? await sync(value) : value;
  }
  return values;
};

WebReflection

Toward better libraries

I am recently re-branding my libraries as µ ^(micro), refactoring these when necessary, dropping IE < 11 support, improving the logic where possible, or providing a better, more robust, or faster, API.

In few words, on the right there is the modern version of libraries I've used for the last ~5 years in production or for side projects, and I suggest anyone having one of the earlier dependencies, to have a look at their modern, micro, counterpart.

How to read these tables

All sizes are minified, brotli compressed, and representing these two files, when possible:

WebReflection

// Least Recently Used
class LRUMap extends Map {
  constructor(length) {
    super().length = length;
  }
  _(key) {
    const value = super.get(key);
    super.delete(key);
    super.set(key, value);
    return value;

WebReflection

What's SWR?

It's React Hooks for Remote Data Fetching, a hook designed to render data on demand.

import useSWR from 'swr'

function Profile() {
  const { data, error } = useSWR('/api/user', fetcher);

WebReflection

uce vs lit-element

A very simple comparison table between these two libraries.

	uce	lit-element
version	1.11.9	2.4.0
license	ISC (simplified MIT)	BSD-3-Clause License
language	JS w/ TS definition	TS w/ JS transpilation
size ( brotli )	9437b ES5 / 6811b ES2015+	8634b ES5 / 6708b ES2015+

WebReflection

FE vs BE

TL;DR enough of this kind of nonsense

---

I've been in the field for ~20 years and started as BE developer, and this is a reference for people thinking that because they are on the BE side, they're somehow entitled to:

• earn more money
• feel superior about FE developers
• joke about JavaScript or minimize the FE effort in any way

WebReflection

// it notifies about the highest peak, and it logs it in console
// it also saves it to the window.participants property
(function () {
  var max = 0;
  var timer = 0;
  var target = document.querySelector('[type="participants"]');
  var Notification = self.Notification || {permission: 'denied'};
  (new MutationObserver(() => {
    var now = Math.max(parseInt(target.innerText.trim()), max);
    if (max < now) {

WebReflection

#!/usr/bin/env bash

echo ""
echo "benchmarking $(tput bold)$1$(tput sgr0)"
echo ""

case $1 in
  nginx )
    sudo systemctl start nginx.service ;;
  express )