Skip to content

Instantly share code, notes, and snippets.

Rich-Harris /
Last active November 3, 2022 09:02
Next-gen Node HTTP APIs

I saw this poll on Twitter earlier and was surprised at the result, which at the time of writing overwhelmingly favours option 1:

Screen Shot 2020-09-10 at 10 19 22 AM

I've always been of the opinion that the (req, res, next) => {} API is the worst of all possible worlds, so one of two things is happening:

  • I'm an idiot with bad opinions (very possibly!)
  • People like familiarity
Rich-Harris / lookup-vs-nested-foreach.js
Created June 29, 2020 17:44
lookup vs nested foreach
View lookup-vs-nested-foreach.js
// re
function with_nested_for_each([a, b]) {
const result = [];
a.forEach(p => {
b.forEach(q => {
if (p.code === q.code) {
result.push(Object.assign({}, p, q));
Rich-Harris /
Last active July 17, 2020 07:09
Svelte style properties naive implementation

This is a copy of an early attempt to imagine an implementation of 'style properties' in Svelte, as described in this RFC. It is preserved here to satisfy curiosity, or in case we hate the new one.

Style properties — handily distinguishable from regular properties by the leading -- used by CSS custom properties — are passed down to components through a separate channel. The example at the top of this RFC might be converted to the following JavaScript:

const slider = new Slider({
  props: {
    value: ctx.value,
Rich-Harris /
Last active March 31, 2023 13:46
Testing array.splice vs array.pop vs set.delete

You have an array. Its sort order doesn't matter. You want to remove an item from this array.

The obvious thing to do would be to use splice:

function remove(array, item) {
  const index = array.indexOf(item);
  array.splice(index, 1);
Rich-Harris /
Last active November 10, 2020 15:49
Svelte vs Knockout
Rich-Harris / index.js
Last active January 22, 2020 22:21
whatwg stream utils
View index.js
const fs = require('fs');
const { ReadableStream, TransformStream, WritableStream} = require('web-streams-polyfill/ponyfill/es2018');
function createReadStream(file, opts) {
return new ReadableStream({
start(controller) {
const stream = fs.createReadStream(file, opts);
stream.on('readable', () => {
const data =;
Rich-Harris /
Last active December 20, 2019 15:19
Source bytes: React vs Ember Octane vs Svelte

I'm procrastinating instead of working on a conference talk, so I decided to implement this component in Svelte to see which framework is most expressive:

Screen Shot 2019-03-30 at 16 42 16

Ember Octane

Here's the original, with the addition of an import for dataUriAsSrc (and updated per @chriskrycho's comment):

Rich-Harris /
Last active December 20, 2019 15:19
Optimising CSS modules


Suppose you have an app like this, and your bundler turns .css files into strings:

// main.js
import './x-foo.js';
import './x-bar.js';

document.body.innerHTML = ``;
Rich-Harris /
Last active February 1, 2023 15:16
What should be the canonical file extension for Svelte components?

So far, most of us have been writing Svelte components into .html files, with a few exceptions (Parcel users, for example, have additional constraints to work with). We're currently discussing whether this should change.

Once you've read the pros and cons, please vote!



  • It signals that you can use your existing HTML (and CSS) knowledge
  • Valid HTML is valid Svelte
Rich-Harris /
Last active November 20, 2019 14:51
Notes on Node streams

I have a real mental blockage around this stuff. Partly because the docs could probably be a little better, partly because it's changed over the years, probably partly because I'm dumb. Whatever. I'm going to try and document how to do stuff I occasionally need to do, so I can refer to it next time.

Return value of pipe

x.pipe(y) === y; // true
x.on(someEvent, callback) === x; // true