Signals are coming for you

Issue #277.April 5, 2024.2 Minute read.
Bytes

Today’s issue: Earning XP to evolve into a new JPEG coding library, low-effort image optimization, and the end of my illustrious career as a Vite maintainer.

Welcome to #277.


Eyeballs logo

The Main Thing

Green Goblin chasing spiderman

me trying to go my whole career without learning Signals

Adding Signals to JavaScript

You’ve probably heard about Signals for reactivity being used by frameworks like Preact, Angular, and Solid.js – but two TC39 delegates, Rob Eisenberg and Daniel Ehrenberg, just took things to the next level by submitting an official proposal to add native Signals to the JavaScript Spec.

Why are they doing this? Is this a good idea or a terrible one? Wtf do Signals actually do again?

Don’t worry, we’ve got you covered.

Quick review: Signals are a way for you to add state to your application. But unlike React, where your app re-renders every time state changes, Signals enable granular state updates. This means that when a Signal value changes, only the most necessary work to update the UI will happen – no rendering and no diffing.

This lets your app skip expensive rendering work and can be great for performance. But what’s the rationale for adding Signals to the JS Spec, instead of just allowing various frameworks to offer Signals in their own way (or not at all)?

The proposal gives a few compelling reasons:

  • Interoperability — By decoupling the reactive model from the rendering view, built-in JavaScript Signals would allow you to share models, components, and libraries between different JS frameworks.

  • Better DevTools — You’d get improved support for inspecting Signals from browsers and runtimes, and existing tools like the element inspector and memory profilers could specifically highlight Signals.

  • Improved DX — Having a standard library would mean smaller bundle sizes, better stability and quality, less framework-specific stuff to learn, and a more common vocabulary for JS developers.

Bottom Line: The next steps for this Stage-0 proposal will be lots of prototyping and integration with multiple frameworks to see if they can actually deliver the benefits listed above.

If all goes well, they’ll continue moving the proposal through the various stages of approval, and we might be able to use this in our apps sometime in 2029 – assuming the singularity hasn’t happened by then 🫡.

        

Postman logo

Our Friends
(With Benefits)

Jimmy Jr from Bob's Burgers dancing with headphones on

My inner 15 year old when T-pain comes on stage at POST/CON

Register for POST/CON 24 | April 30-May 1 👀

The biggest API conference of the year is happening in SF on April 30-May 1, and it features a great mix of high-level talks from tech executives and hands-on training from some of the best developers in the world.

You can see the full lineup at POST/CON 24 here — but don’t miss out on these 3 special talks:

  • “Humanizing APIs” by Shweta Palande from Cisco will explore how companies can use interactive documentation, accessible support channels, and feedback loops to elevate DX and transform API innovation.

  • “Navigating GraphQL Adoption in the Real World” by Suresh Muthu (a Principal Engineer at Intuit) will give a comprehensive deep dive into the pros and cons of adopting GraphQL’s unique infrastructure in a variety of scenarios.

  • “Developer Marketing Through Postman Public Workspaces” by Sid Maestre from APIMatic will share his experience using public workspaces to boost developer awareness and adoption of his team’s APIs.

Get 20% off your ticket with the promo code PCBYTES20


Spot the Bug logo

Spot the Bug

Sponsored by Knock

Knock provides flexible, reliable notifications infrastructure, and their brand new SlackKit gives you embeddable UIs and APIs that let you ship a powerful Slack integration in hours, not weeks.

function reverseString(str) {
  return str.split("").reverse().join("");
}

let reversedString = reverseString("Hello, 👋!");
console.log(reversedString);

Cool Bits logo

Cool Bits

  1. Google just released Jpegli, a new JPEG coding library that’s designed to be faster, more efficient, and more visually pleasing than traditional JPEG. And if you earn enough XP, it’ll eventually evolve into a Jpeglipuff.

  2. Lachlan Miller made this 9-minute video to explain How Vite works under the hood.

  3. Convex just launched a brand new Startup Program, where you can apply to get 1 year free of their fully type safe backend-as-a-service, which gives you everything you need to build, launch, and scale your app. [sponsored]

  4. Lazar Nikolav wrote about Low-effort image optimization tips, and I’m 90% sure he’s not referring to my social image.

  5. Ahmad Shadeed created this Interactive guide to CSS container queries to help you understand what problems they solve and how you can use them in your workflow.

  6. Sigmund Cherem wrote on the Dart blog about The history of JS interop in Dart.

  7. Directus just released the State of Data survey results, based on the responses from over 700 Bytes readers. It doesn’t roast you all quite as much as we were hoping, but it does point out a few surprising trends.

  8. QA Wolf can get your web app to 80% test coverage in weeks, not years. They build and maintain your test suite in Playwright, provide unlimited parallel test runs on their infra, and send human-verified bug reports directly to you. [sponsored]

  9. Princeton’s NLP team just released SWE-agent, which turns language models into software engineering agents that can fix bugs and issues in real GitHub repos. Does this mean I should stop calling myself a Vite maintainer for submitting one PR to fix a typo in the repo?

  10. Khawaja Shams and Tony Valderrama wrote about how Garantia Data pulled off the biggest heist in open source history, by acquiring the legal rights to the Redis project in 2018, changing their company’s name to Redis in 2021, then changing the Redis project’s licensing agreement to no longer be open source last month. Bold strategy, let’s see if it pays off for them.


Spot the Bug logo

Spot the Bug: Solution

Sponsored by Knock

This bug occurs because the split method treats the string as an array of 16-bit units, not as an array of characters resulting the unexpected output: !�� ,olleH. By using Array.from(str) or [...str] the string is split into an array of actual characters, respecting the surrogate pairs.

Using Array.from:

function reverseString(str) {
  return Array.from(str).reverse().join("");
}

let reversedString = reverseString("Hello, 👋!");
console.log(reversedString);

Using the spread operator:

function reverseString(str) {
  return [...str].reverse().join("");
}

let reversedString = reverseString("Hello, 👋!");
console.log(reversedString);