Skip to content

Instantly share code, notes, and snippets.

Avatar

Christian Juth christianjuth

View GitHub Profile
View hooks.ts
function useMouseSpeed(updateInterval = 500) {
const lastUpdateRef = useRef(Date.now())
const prevPositionRef = useRef<MousePosition | null> (null)
const currentPositionRef = useRef<MousePosition | null> (null)
const [speed, setSpeed] = useState(0)
useEffect(() => {
function trackMouse({ pageX: x, pageY: y }: MouseEvent) {
x = x / window.innerWidth
y = y / window.innerHeight
@christianjuth
christianjuth / App.tsx
Last active Aug 6, 2021
This is my own React state machine inspired by XState
View App.tsx
import { createMachine, useStateMachine } from "./stateMachine";
const machine = createMachine({
initial: "saved",
context: {
input: ""
},
states: {
saved: {
edit: "hasChanges"
View main.js
function memo(fn) {
const dict = {}
let id
const perform = { calls: 0, memoHits: 0 }
return (...args) => {
perform.calls++
clearTimeout(id)
id = setTimeout(() => {
console.log(`memo hit rate = ${perform.memoHits}/${perform.calls}`)
}, 1000)
View machine.js
// Available variables:
// - Machine
// - interpret
// - assign
// - send
// - sendParent
// - spawn
// - raise
// - actions
@christianjuth
christianjuth / merge_sort.py
Created Nov 28, 2020
Merge Sort in Python
View merge_sort.py
def sort(arr):
length = len(arr)
if length >= 2:
splitIndex = int(length / 2)
left = arr[0:splitIndex]
right = arr[splitIndex:length]
left = sort(left)
View machine.js
// Available variables:
// - Machine
// - interpret
// - assign
// - send
// - sendParent
// - spawn
// - raise
// - actions
View index.html
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/css?family=Open+Sans|Roboto:900|Pacifico" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<link rel='stylesheet' href='style.css'/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src='script.js'></script>
</head>
<body>