Skip to content

Instantly share code, notes, and snippets.

View anuraghazra's full-sized avatar

Anurag Hazra anuraghazra

View GitHub Profile


const shade = 100;
type Shade = 100;


anuraghazra /
Last active March 21, 2023 21:06
TypeScript TokenizeTheme type performance

In these two files if you change getToken{slow,fast}'s passed value (just add a random letter anywhere) you'll see that the fast version is getting type checked about 3x to 5x faster than the slow one.

I'm not sure why using key remapping and using keyof {} is about 3x to 5x faster when doing type checking.

My guess is that in the slow version is using index access with the {}[keyof Theme] which is generally slower?

"button": {
"base": "",
"variant": {
"ghost": "lib:text-red-800",
"secondary": "lib:bg-gray-100 lib:text-gray-800",
"outline": "lib:border lib:border-gray-300 lib:text-gray-800",
"primary": "lib:bg-red-800 lib:text-red-200"
"size": {
// TypeSafe classnames package
type IsNever<T> = [T] extends [never] ? true : false;
type TruthyKind = Record<string, boolean>;
type StringOrTruthy = string | TruthyKind | unknown;
* Filter tuple by type (ignore never type)
* - Filter<["bg", never], string> -> ["bg"]

Network Requests

There are a few ways to get info from an API

What is await?

'''ts const response = await fetch("")

"Experiments": [
["", "AnuReact (minimal react clone)"],
["", "CSS-in-GraphQL"],
["", "React Folder Tree Component"],
["", "React Custom Canvas Renderer"],
["", "Minimal react fade component"],
["", "Verly.js React Integration"],
["", "React PubSub"],
["", "React toast component experiment"],
anuraghazra / minimal-templating-engine.ts
Last active October 28, 2023 09:07
Minimal Templating Engine In Javascript
// magic!
function dom<Props extends Record<string, unknown>>(
str: TemplateStringsArray,
...args: string[] | ((props: Props) => string)[]
) {
const interleaved = args.flatMap((arg, index) => {
return [arg, str[index + 1]];
return (props?: Props) =>
anuraghazra / index.html
Created November 5, 2019 07:18
Testing Gist API
<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="./style.css">