Skip to content

Instantly share code, notes, and snippets.

@sekoyo
sekoyo / throttle.ts
Last active August 26, 2023 00:20
throttle.ts
export const throttle = <FN extends (...args: Parameters<FN>) => ReturnType<FN>>(
fn: FN,
delay: number
) => {
let wait = false
let timeout: undefined | number
let prevValue: ReturnType<FN> | undefined = undefined
const throttleFn = (...args: Parameters<FN>) => {
if (wait) {
@sekoyo
sekoyo / useResizeObserver.ts
Created March 18, 2022 17:54
Resize observer hook for react
import { useEffect, useRef, useState } from 'react'
export function useResizeObserver<E extends Element>() {
const ref = useRef<E>(null)
const [width, setWidth] = useState(0)
const [height, setHeight] = useState(0)
useEffect(() => {
if (!ref.current) {
return () => {}
@sekoyo
sekoyo / useThrottledState.ts
Created March 17, 2022 20:59
A react hook for throttled state that doesn't suck
import { useState, useRef, useEffect, useCallback } from 'react'
export type StateSetter<S> = (intermediateState: S) => S
// For optimal performance mutate state in setIntermediateState
// and pass a custom `makeNewState` for when the final state is
// updated. e.g. `obj => {...obj}` or `arr => [...arr]`
export function useThrottledState<S>(
initialState: S | (() => S),
timeout = 300,
@sekoyo
sekoyo / fastifySchemaExample.ts
Last active February 1, 2022 16:39
Fastify JSON Schema example
fastify.get<{ Querystring: { address: string } }>(
'/checkAddress',
{
schema: {
querystring: {
type: 'object',
properties: {
postcode: { type: 'string' },
},
required: ['postcode'],
@sekoyo
sekoyo / server.ts
Last active December 24, 2021 13:07
Fastify NodeJS server example
import Fastify from 'fastify'
import middie from 'middie'
import cors from 'cors'
import frameguard from 'frameguard'
import xXssProtection from 'x-xss-protection'
const fastify = Fastify({
logger: true,
})
@sekoyo
sekoyo / binarySearch.ts
Created September 1, 2021 12:58
Binary Search (JS/TS)
function binarySearch<T = any>(
findValue: number,
items: T[],
getValue: (item: T) => number
) {
let lo = 0
let hi = items.length - 1
while (lo <= hi) {
const mi = (lo + hi) >>> 1
@sekoyo
sekoyo / package.json
Created July 18, 2021 15:07
A component/library config for rollup
{
"main": "dist/index.cjs.js",
"module": "dist/index.js",
"exports": {
".": {
"import": "./dist/index.js",
"require": "./dist/index.cjs.js"
}
},
"types": "dist/index.d.ts",
@sekoyo
sekoyo / useSizeObserver.ts
Last active August 4, 2021 16:07
React useSizeObserver
import { useEffect, useRef } from 'react'
export function useSizeObserver(
elRef: React.RefObject<HTMLElement | null>,
onChange: (width: number, height: number) => void,
shouldObserve = true
) {
const onChangeRef = useRef(onChange)
onChangeRef.current = onChange
import { round, floor, ceil, roundToTick, floorToTick, ceilToTick } from './math'
describe('math', () => {
it('round works up to 8 decimals and 999 million', () => {
expect(round(123.123456789, 0)).toEqual(123)
expect(round(123.123456789, 1)).toEqual(123.1)
expect(round(123.123456789, 2)).toEqual(123.12)
expect(round(123.123456789, 3)).toEqual(123.123)
expect(round(123.123456789, 4)).toEqual(123.1235)
expect(round(123.123456789, 5)).toEqual(123.12346)
@sekoyo
sekoyo / DecayAnimation.ts
Created August 8, 2020 12:48
DecayAnimation for scrolling
type UpdateCb = (x: number, y: number) => void;
export interface DecayAnimationProps {
deceleration?: number;
onUpdate: UpdateCb;
}
export class DecayAnimation {
deceleration: number;
_onUpdate: UpdateCb;