Skip to content

Instantly share code, notes, and snippets.

View history.min.js
function t(){let t=new Set;return{listen:e=>(t.add(e),()=>{t.delete(e)}),emit(){t.forEach((t=>t()))}}}function e(){return Math.random().toString(36).substring(2,8)}function n(t,e,n){return Math.min(Math.max(t,e),n)}function r(t,e){return(t.startsWith(e)?"":e)+t}function a({pathname:t,search:e,hash:n}){return{pathname:r(t,"/"),search:r(e,"?"),hash:r(n,"#")}}function s({pathname:t,search:e,hash:n}){return t+("?"===e?"":e)+("#"===n?"":n)}function h(t){return s(a(t))}function u(t){let[e,n=""]=t.split("#"),[r,s=""]=e.split("?");return a({pathname:r,search:s,hash:n})}function i(t){return s(u(t.substring(1)))}function o(t){if("string"==typeof t)return t;{let{pathname:e="",search:n="",hash:r=""}=t;return h({pathname:e,search:n,hash:r})}}function l(t){return{location(){return e=t.path(),n=t.state(),r=t.key(),{...u(e),state:n,key:r};var e,n,r},push(e,n){let r=o(e);t.push(r,n)},replace(e,n){let r=o(e);t.push(r,n)},go(e){t.go(e)},back(){t.go(-1)},forward(){t.go(1)},listen:e=>t.listen(e)}}function p(n){let r=n.history,a=t
View capitalize.js
function capitalize(locale, string) {
let segmenter = new Intl.Segmenter(locale, { granularity: "grapheme" })
let result = ""
for (let item of segmenter.segment(string)) {
if (item.index === 0) {
result += item.segment.toLocaleUpperCase(locale)
} else {
result += item.segment

Hard to type symbols (on non-US keyboards)

I asked on twitter which symbols are hardest to type on non-US keyboards.

I didn't get a ton of responses, but I think it was clear which ones were most problematic.

char count visual notes
& 4 ####
^ 10 ########## Swedish: Dead Key, German: Typing vowels after becomes â
View map-destructuring.js
// Destructuring works on arrays, sets, object, but not maps.
// Today [array, destructuring] works on sets because it
// uses [Symbol.iterator]
// But {object, destructuring} *can't* call and iterator
// because it doesn't have an order to work with.
// But this difference can lead to confusion for beginners,
// and makes maps less usable for everyone.
View tweet-promise-isfulfilled.js
// Synchronously check if a promise has already been fulfilled
// >> true | false
// This allow you to make decisions synchronously
if (Promise.isFulfilled(promise)) {
// We know we're not taking a "risk" awaiting this promise
await promise
} else {
// i.e. Avoid "flash of loading spinner"
View spawn.js
// Syntax proposal:
spawn {
await somethingAsync()
// `spawn` would be available wherever `await` is available
async function fn() {
await somethingAsync()
spawn { /* ... */ }
jamiebuilds /
Last active Oct 26, 2021
Value-derived types in TypeScript are super powerful, but you should be thoughtful in how/when you use them

Tradeoffs in value-derived types in TypeScript

Many of the more "advanced" typescript features can be used for creating "value-derived" types.

At its simplest form:

let vehicle = { name: "Van", wheels: 4 }
View houdini.d.ts
declare interface CSS {
layoutWorklet: Worklet // eslint-disable-line no-undef
paintWorklet: Worklet // eslint-disable-line no-undef
animationWorklet: Worklet // eslint-disable-line no-undef
declare type ChildDisplay = "block" | "normal"
declare type LayoutSizingMode = "block-like" | "manual"
declare interface LayoutOptions {

assert() (sometimes called invariant())

Instead of checks like:

if (value === null) {
  throw new Error("missing value")