react-19

Automate React 19 patterns with the React Compiler to remove manual memoization.

Updated Aug 23, 2026
One-click install
npx skills add https://github.com/stephanofer/finance-trackerv2 --skill react-19-stephanofer
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: react-19
Source: https://github.com/stephanofer/finance-trackerv2/tree/main/.opencode/skill/react-19
Command: npx skills add https://github.com/stephanofer/finance-trackerv2 --skill react-19-stephanofer

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

React 19 patterns with React Compiler help developers avoid manual memoization by using compiler optimizations to decide when to re-render.

Core Features & Use Cases

  • Zero manual memoization: rely on compiler optimizations to skip unnecessary memoization calls.
  • Import best practices: prefer named imports and explicit component structure.
  • Server Components First: guidance on server vs client components and use of use() hook.

Quick Start

Open the skill's examples and start by importing named hooks, then create a server component and a client component using 'use client' when needed.

Frequently Asked Questions about react-19

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How does the React Compiler eliminate manual memoization in React 19?▼

The React Compiler analyzes component code during build to automatically optimize re-renders, allowing React 19 development with zero manual memoization calls like useMemo or useCallback.

What are the import conventions for server and client components in React 19?▼

React 19 components should use explicit named imports for hooks and structure, applying the 'use client' directive specifically when creating client components across the server-client boundary.

How do I use the use() hook for streaming data in React 19 server components?▼

React 19 implements a Server Components First approach, utilizing the use() hook to handle streaming data directly within server components before passing data across to client boundaries.

Do I need useCallback and useMemo when using React 19 compiler optimizations?▼

No, you can rely on React Compiler optimizations to automatically decide when to skip memoization, effectively eliminating the need for manual useMemo and useCallback calls in your frontend components.

Can I use the React Compiler for frontend patterns across server and client boundaries?▼

Yes, the React Compiler applies patterns across server and client boundaries, managing frontend component development including server components, client components, and explicit named import conventions.