JavaScript

🙂 Follow a Single HTTP Request Through Its ~200ms Life From the creator of NodeBook, a thorough guide to Node's internals, comes a scroll-driven visualization following every step a single HTTP POST request takes from the user's click to Node's event loop and on to a database behind it. Ishtmeet Singh

CHALLENGE

class Timer {
  constructor() { this.seconds = 0; }
  start() {
    this.tick = () => { this.seconds++; return this.seconds; };
    return this.tick;
  }
}

const t = new Timer();
const tick = t.start();
const obj = { seconds: 100, tick };
console.log(tick(), obj.tick(), t.seconds);

😲 LiteParse 2: Fast, Light PDF Document Parsing A PDF parser built in Rust with bindings for Node (plus WASM, Rust, and Python) — it worked great in my testing. It includes OCR, handles layouts/is spatially aware, and is fast (a complex 140-page PDF took ~10 seconds). Here's how to get started from Node. LlamaIndex

😮 How a Fake Interview's Coding Challenge Steals Credentials A dissection of a North Korean campaign that hides malware inside SVG images in a fake job interview's JavaScript 'coding challenge'. The targeting of job-seeking devs is on the increase, as Roman Imankulov recently discovered first-hand. Daniel Stepanic (Elastic)

Famously, the only thing Java gave JavaScript was the first four letters of its name. That goes unmentioned in 😉 this new documentary about Java (74 minutes), but I enjoyed learning Java's story anyway. It's from the same folks as the fantastic Vite, Angular, and Node.js documentaries.

🤩 Flint: Chart Specs that Compile to Vega-Lite, ECharts, or Chart.js A Microsoft project that compiles a simple, declarative JSON-based spec of a data visualization into a form that Vega-Lite, ECharts or Chart.js can render. It's pitched at agentic use, but is a simple intermediate format humans could benefit from too. Microsoft Research

😃 Framework Benchmarks: Compare Frontend Frameworks An experienced developer built and benchmarked the same app across numerous frameworks (e.g. Angular, Solid, React, Alpine.js…). Here are the results, covering bundle size, build time, UX metrics, and more. Alicia Sykes

CHALLENGE

function* pipeline(...fns) {
  let value = yield;
  for (const fn of fns) {
    value = yield fn(value);
  }
  return value;
}

const double  = x => x * 2;
const addTen  = x => x + 10;
const square  = x => x * x;

const gen = pipeline(double, addTen, square);

gen.next();           // prime the generator
const r1 = gen.next(3);
const r2 = gen.next(r1.value);
const r3 = gen.next(r2.value);

console.log(r1.value, r2.value, r3.value);

CHALLENGE

function highlight(strings, ...values) {
  return strings.reduce((result, str, i) => {
    const value = values[i - 1];
    const transformed =
      typeof value === "number"
        ? `[${value * 2}]`
        : `(${String(value).toUpperCase()})`;
    return result + transformed + str;
  });
}

const product = "widget";
const qty = 4;
const price = 12.5;

const output = highlight`Order: ${product} x${qty} @ $${price}`;
console.log(output);

CHALLENGE

const p1 = new Promise((resolve) => {
  console.log("A");
  resolve("B");
});

const p2 = p1.then((val) => {
  console.log(val);
  return "C";
});

p2.then((val) => {
  console.log(val);
});

console.log("D");

CHALLENGE

const tag = (strings, ...values) => {
  return strings.reduce((result, str, i) => {
    const value = values[i - 1];
    const transformed =
      typeof value === "number" ? value * 2 : value?.toUpperCase();
    return result + transformed + str;
  });
};

const name = "carlos";
const score = 42;
const bonus = null;

const output = tag`Player: ${name}, Score: ${score}, Bonus: ${bonus}`;
console.log(output);

CHALLENGE

const user = {
  profile: {
    name: "Marcus",
    address: {
      city: "Berlin",
      zip: "10115"
    }
  },
  getSubscription: () => ({
    plan: "pro",
    features: ["analytics", "exports"]
  })
};

const city       = user?.profile?.address?.city;
const country    = user?.profile?.address?.country?.toUpperCase();
const firstFeature = user?.getSubscription?.()?.features?.[0];
const adminRole  = user?.roles?.[0]?.name ?? "guest";

console.log(city, country, firstFeature, adminRole);