Log
Logs
Notes on patterns, practices, and workflows from the Joyco team.
18Understanding the Agentic Chat Model10
How the Vercel AI SDK chat model actually fits together, who owns the conversation between server and client, what the server-sent event stream looks like on the wire, how useChat folds those events into typed message parts, and why you render tool calls straight from the parts instead of lifting them into component state.17Return, Don't Throw37
Return expected failures as one shared Result union built by success() and error(), so callers must look before touching data and throwing only ever means a bug.16Phased State: Modes as Tagged Unions57
Model a thing's modes as a tagged union instead of a bag of booleans, so illegal states can't exist and you can react to what just changed.15Derive, Don't Mutate73
When one value has many writers, last-write-wins quietly corrupts your output. Give each source its own slot and resolve them at one point instead.14Phantom Merge Conflicts49
Why git shows conflicts in files you never touched when the history under your branch gets rewritten, and how git rebase --onto fixes them without resolving a single marker.13Reduced motion and GSAP: The Invisible Collision Layer113
12The Render Pipeline269
Deep dive into each stage of the browser rendering pipeline, covering what runs on main vs compositor thread and what makes each step slow.11WTF Is Layout Thrashing111
What forced reflows are, why interleaving DOM writes and reads tanks your frame rate, and how to batch them.10Color Spaces sRGB & Linear97
How sRGB encoding spends precision where your eyes care most, and why shader math must happen in linear space.09Performance Monitor84
Chrome DevTools' real-time Performance monitor panel for catching memory leaks, layout thrashing, and jank as it happens.08WebGL Scroll Sync187
Why WebGL canvas content drifts from the DOM during fast scrolls and how to fix it with compositor-aware techniques.07Promises, PPR, and the Root Provider Pattern69
Pass promises instead of awaited data to context providers so the shell renders instantly with PPR.06Parallel Claudes with cw62
Run multiple Claude Code sessions on the same repo without conflicts using git worktrees managed by cw.05Group-has-[.magic]52
Style distant elements based on child state using Tailwind's group and has-[*] modifiers instead of lifting state.04Context is all you need44
Replace prop drilling with React context to share state and derived values across deeply nested components.03Agentic Thinking66
Design fewer but more capable tools, enforce clear usage criteria, and keep context windows lean.02AI Driven Development69
Managing your main attention thread, shaping features with AI, and offloading long-running work to background agents.01The Slot Approach78
Style inner elements from the parent using data-slot attributes instead of multiple className props.