react-compiler-unmemo
An open source codemod that safely removes useMemo and useCallback from React codebases — streamlining migration from React 18 to React 19 and the React Compiler
Published on npm • MIT Licensed • Zero AST dependencies
Project Overview
The Problem
React 19 introduces the React Compiler, which handles memoization automatically. Codebases built on React 18 are littered with useMemo and useCallback calls that are now redundant. Manually removing them across thousands of files is tedious, error-prone, and risks breaking type annotations and import statements.
The Solution
A two-step pipeline that first strips useMemo and useCallback calls using a character-by-character parser, then applies fixups to restore lost type annotations. Safe dry-run by default, idempotent, and handles nested generics, multi-line hooks, and complex edge cases that regex-based tools miss.
Before & After
One command transforms your codebase — removing boilerplate while keeping everything type-safe
BEFORE
const value = useMemo(() => computeExpensiveValue(a, b), [a, b]);
const handler = useCallback((e) => doSomething(e), [doSomething]);
import { useMemo, useCallback, useState } from "react";AFTER
const value = computeExpensiveValue(a, b);
const handler = (e) => doSomething(e);
import { useState } from "react";Architecture
A two-step pipeline with a character-by-character parser — no AST dependencies
AI Development Breakthrough
Earlier LLM models in Windsurf couldn't accomplish this codemod — they got stuck building complex SED scripts that failed on real-world patterns. Claude Opus 4.6 was the first AI model capable of generating this working codemod tool with a custom character-by-character parser, demonstrating a significant leap in AI-assisted development capabilities.
npx react-compiler-unmemo ./my-app
Entry point — dry-run by default
Hook Removal
src/remove-hooks.mjsPhase 1
Strip generic type parameters from hook calls
Phase 2
Remove hook calls, unwrap arrow functions, strip dep arrays
Phase 3
Clean unused useMemo/useCallback imports
Fix Type Annotations
src/fix-type-annotations.mjsRestore Types
Recover lost generic type annotations from stripped hooks
Infer Context
Heuristic type inference from surrounding code patterns
Clean, type-safe code
Ready for React Compiler — run tsc --noEmit to verify
Key Features
Built for real-world codebases with complex patterns
Character Parser
No AST dependencies
- Handles nested generics like ColumnsType<TaxArea> that regex can't match
- Tracks strings, template literals, and escape sequences
- Comment-aware — skips hooks inside line and block comments
Safe by Default
Dry-run first, write when ready
- Dry-run is the default — preview all changes before applying
- Idempotent — safe to re-run without double-processing files
- Complex hook bodies become IIFEs to preserve correctness
Comprehensive
Handles real-world patterns
- useMemo, useCallback, and React.* prefixed variants
- Multi-line hooks spanning dozens of lines with nested objects
- Import cleanup — removes unused hooks, preserves the rest
Why Remove Manual Memoization?
React Compiler handles memoization automatically — removing hooks is optional but delivers real benefits
Cleaner Code
Less boilerplate, easier to read and maintain
Aligns with Modern React
React Compiler handles memoization automatically
Smaller Bundles
Unused hook imports are removed entirely
Safe to Re-run
Idempotent — won't touch already-processed files
Quick Start
# Preview changes (safe default — no files modified)npx react-compiler-unmemo ./my-react-app# Apply changes when readynpx react-compiler-unmemo ./my-react-app --write# Type-check your project afterwardnpx tsc --noEmit
Results
Runtime dependencies beyond glob
Safe dry-run by default
Pipeline: remove hooks → fix types
“React Compiler works fine with existing manual memoization — it preserves and layers on top of it. Removing hooks is optional for cleanliness and readability, but not required for performance.”— React Documentation
Tech Stack
Need a migration tool built?
We build developer tools, codemods, and migration utilities — from open source packages to enterprise-grade toolchains.
What We Can Build for You:
Codemods & Migration Tools
Automated code transformations for framework upgrades
npm Packages
Open source and private packages for the JS ecosystem
CLI Developer Tools
Build systems, linters, and workflow automation
Enterprise Toolchains
Custom tooling for large-scale codebases
Need help with React tooling or codemods?
I can help you build developer tools, create custom codemods, and streamline your React development workflow.
What I Can Build for You:
CLI Developer Tools
Build systems, linters, and workflow automation
Enterprise Toolchains
Custom tooling for large-scale codebases
Codemod Development
Automated code transformations at scale
Open Source Packages
Publish and maintain npm packages
React Compiler Migration
Smooth transitions to React 19 and beyond
Safe Refactoring
Transform code without breaking changes
Specializing in React tooling • Codemods • Open source • Developer experience