Lightnews — Scholar-powered news

Tom Sherman

@tom.sherman.is

I'm actually on the other panel

Character from "the garden of earthly delights" eating a giant strawberry

November 4, 2025 at 7:44 PM

Tom Sherman

@tom.sherman.is

It's been real

My wife (left) dressed as Lord Farquad, myself (right) dressed as Fiona (ogre version)

October 31, 2025 at 11:41 PM

Tom Sherman

@tom.sherman.is

woah discover runs on graze????

Screenshot of the parent post displayed on the "Discover" feed in the Bluesky app

October 22, 2025 at 2:37 PM

Tom Sherman

@tom.sherman.is

My top 10 if anyone was asking

@jakearchibald.com

1. JavaScript top-level await
2. CSS text-box and related longhand properties
3. Federated credential management (FedCM)
4. Async iterable ReadableStreams
5. HTML <link rel="prefetch">
6. JavaScript Temporal
7. CSS line-clamp property
8. HTML blocking="render" attribute on <link>, <script> and <style>
9. WebTransport API
10. Web Share API

October 20, 2025 at 11:28 AM

Tom Sherman

@tom.sherman.is

This is a worse failure mode than anything that exists in React today. I can't even compose things without worrying about when they call update

https://x.com/rickhanlonii/status/1978250938616828171?

October 15, 2025 at 5:59 PM

Tom Sherman

@tom.sherman.is

On the other hand this is potentially the worst UX in all of Bluesky right now

Screenshot of "select moderation service" step in the Bluesky report flow

October 14, 2025 at 8:41 PM

Tom Sherman

@tom.sherman.is

Yeah I wasn't creating a new abort controller and setting it in the ref, I also wasn't discarding the result of getCities when the transition was aborted

Still left with a TODO which made me realise you can't totally abstract this pattern away, what you show on abort is specific to each use case

<select
onChange={(e) => {
controllerRef.current?.abort();
const controller = new AbortController();
controllerRef.current = controller;

const state = e.currentTarget.value;
startTransition(async () => {
const cities = await getCities(state, controller.signal);
startTransition(() => {
if (controller.signal.aborted) {
// TODO: Show an aborted state here, maybe just clear the cities
return;
}
setCities(cities);
});
});
}}
>

October 14, 2025 at 2:15 PM

Tom Sherman

@tom.sherman.is

Hmmmm, yeah you're right I don't think uAS is doing anything for me here

I reached for it to solve the out of order completion bug but the abort controller itself solves that I think. Just using startTransition and useRef(AbortController) is much simpler

import { useRef, useState, useTransition } from 'react';
import './App.css';

function App() {
const [isPending, startTransition] = useTransition();
const controllerRef = useRef<null | AbortController>(null);
const [cities, setCities] = useState<string[]>([]);

return (
<>
<select
onChange={(e) => {
controllerRef.current?.abort();
const state = e.currentTarget.value;

startTransition(async () => {
const cities = await getCities(state);
startTransition(() => {
setCities(cities);
});
});
}}
>
<option />
{Object.keys(stateCitites).map((state) => (
<option key={state}>{state}</option>
))}
</select>

<select disabled={isPending}>
{isPending ? (
<option>Loading... </option>
) : (
cities.map((city) => <option key={city}>{city}</option>)
)}
</select>
</>
);
}

const stateCitites: Record<string, string[]> = {
Utah: ['Salt Lake City', 'Provo', 'West Valley City'],
California: ['Los Angeles', 'San Francisco', 'San Diego'],
Texas: ['Houston', 'Dallas', 'Austin'],
Florida: ['Miami', 'Orlando', 'Tampa'],
'New York': ['New York City', 'Buffalo', 'Rochester'],
};

async function getCities(state: string) {
await new Promise((res) => setTimeout(res, Math.random() * 1500 + 100));
return stateCitites[state] ?? [];
}

export default App;

October 14, 2025 at 8:35 AM

Tom Sherman

@tom.sherman.is

@lakshikag.bsky.social FYI your profile appears to be entirely broken, might be some messed up timestamps in some of your posts?

October 10, 2025 at 11:16 AM

Tom Sherman

@tom.sherman.is

@ricky.fm what are you thoughts on this useAbortableAction hook?

useActionState runs the actions in sequence, this allows you to call abort syncronously before calling the action in a transition

function useAbortableActionState(action, initialState, permalink) {
const controllerRef = (useRef < AbortController) | (null > null)

function abort() {
controllerRef.current?.abort()
}

function wrappedAction(state, payload) {
const controller = new AbortController()
controllerRef.current = controller

return Promise.race([
new Promise() <
never >
((resolve) => {
controller.signal.addEventListener('abort', () => {
console.log('abort', state)
// This will never actually get rendered by react
// Rejecting here however will trigger an error boundary so we just resolve with a junk value
resolve(undefined)
})
}),
action(state, payload),
])
}

return [...useActionState(wrappedAction, initialState, permalink), abort]
}

// Usage:

function App() {
const [cities, abortableAction, isPending, abort] =
useAbortableActionState(action)

return (
<select
onChange={(e) => {
abort()
const state = e.currentTarget.value

startTransition(() => {
updateCitiesAction(state)
})
}}
/>
)
}

October 9, 2025 at 5:32 PM

Tom Sherman

@tom.sherman.is

40ms per poast

Screenshot of timing panel in chrome devtools

Queuing: 0.83ms
Stalled: 0.27ms
Requet sent: 0.15ms
Waiting for server response: 38.24ms
Content download: 0.56ms

Total: 40.05ms

October 6, 2025 at 3:59 PM

Tom Sherman

@tom.sherman.is

Certified loser just ordered the loser shoe

NikeCraft Pre-Order: General Purpose Participation Shoe

September 26, 2025 at 8:47 PM

Tom Sherman

@tom.sherman.is

DIDs don't have multiple identities, they can have multiple handles. The DID is the identity, a handle is like an alias. Sorry this is kinda a nitpick!

As for your question, the spec basically says that apps should ignore all handles except the first one lists in the DID doc.

The current handle for the DID is found in the alsoKnownAs array. Each element of this array is a URI. Handles will have the URI scheme at://, followed by the handle, with no path or other URI parts. The current primary handle is the first valid handle URI found in the ordered list. Any other handle URIs should be ignored.

September 26, 2025 at 12:42 PM

Tom Sherman

@tom.sherman.is

Hmm, maybe I'm holding wrong but this just gives me "RPC session was shut down by disposing the main stub" when i do a second RPC on the client

Or maybe it's a deno-specific issue 🤔

September 26, 2025 at 9:28 AM

Tom Sherman

@tom.sherman.is

So instead, could the gateway multiplex many sessions over a single socket connection to the downstream services?

I have the thing on the left running, could the right design be possible?

A diagram comparing two gateway connection models. The left shows a gateway opening a new socket to backend services for each client session. The right shows a gateway multiplexing multiple client sessions over a single, shared socket per backend service to reduce connection overhead.

September 25, 2025 at 8:42 PM

Tom Sherman

@tom.sherman.is

Looks like something like that can work! The types don't like it but it works at runtime

Requires spinning up many websockets which doesn't feel ideal, especially as they need to be created per client

Between the gateway and services it'd be better to have a single websocket per service somehow

Vscode screenshot of 4 code files: client, customer service, order service, and gateway

September 25, 2025 at 2:32 PM

Tom Sherman

@tom.sherman.is

It's incredibly easy to wire up in a deno server

import {
RpcTarget,
newHttpBatchRpcResponse,
newWebSocketRpcSession,
} from "capnweb";

class MyApiServer extends RpcTarget {
hello(name: string) {
return `Hello, ${name}!`;
}
}

Deno.serve({ port: 8000 }, (req) => {
if (req.headers.get("upgrade") != "websocket") {
return newHttpBatchRpcResponse(req, new MyApiServer());
}

const { socket, response } = Deno.upgradeWebSocket(req);

newWebSocketRpcSession(socket, new MyApiServer());

return response;
});

September 25, 2025 at 10:25 AM

Tom Sherman

@tom.sherman.is

imagine not supporting these types in the big 2025. common react flight w

Screenshot from the capnweb docs:

The following types are not supported as of this writing, but may be added in the future:

Map and Set
ArrayBuffer and typed arrays other than Uint8Array
RegExp
ReadableStream and WritableStream, with automatic flow control.

September 25, 2025 at 10:00 AM

Tom Sherman

@tom.sherman.is

Might just start posting all of my skate clips here, this game is so good

September 23, 2025 at 9:53 PM

Tom Sherman

@tom.sherman.is

Does anyone know of a JS library that can parse the package.json#repository field and give me a URL?

The thing shown under "repository" in the npm UI

Repository UI in npm showing github.com/facebook/react

July 22, 2025 at 4:31 PM

Tom Sherman

@tom.sherman.is

This is not normal???

Sign in to Bluesky emails in my email inbox

July 17, 2025 at 7:13 PM

Tom Sherman

@tom.sherman.is

@graze.social Pretty sure you can ask the bsky API for this now, think it requires oauth

June 6, 2025 at 11:43 AM

Tom Sherman

@tom.sherman.is

If you weren't aware of FedCM, IMO this would be such a good UX for atproto login. No entering handles (after the first time)

May 17, 2025 at 8:02 PM

Tom Sherman

@tom.sherman.is

I seem to use this pattern a lot with React form actions so thought I'd suggest adding it to the docs

github.com/reactjs/react.de…

You can override the default reset behaviour of the form by additionally passing an onSubmit prop to the <form> component calls preventDefault on the event and calling the action yourself. Passing onSubmit alongside action ensures the form can be progressively enhanced if this component is rendered to HTML on the server.

April 30, 2025 at 2:13 PM

Tom Sherman

@tom.sherman.is

Just shipped some UX improvements to @frontpage.fyi login ✨

Those in the mycosphere can login without typing anything

Self hosters can login by entering their PDS URL

Also allows signups! You can signup to any (open) PDS (including bsky.social) without creating a Bluesky profile

A screenshot of the new Frontpage login form found at https://frontpage.fyi/login

April 28, 2025 at 7:49 PM

Light upyour news

Sign in to Lightnews

Sign up to start reading

Connect Bluesky

Connect with Bluesky

Light up
your news