Does this skill provide guidance on Error Boundaries in React 19?

Yes, it covers the continued requirement for class components for error boundaries and provides integration patterns for popular libraries like react-error-boundary.

Does this skill cover the new 'use' hook?

Yes, it includes detailed patterns for unwrapping Promises and Context using the 'use' hook, specifically showing how to integrate them with Suspense boundaries.

How does this skill help with the React Compiler?

It provides specific patterns that ensure components remain pure and 'compiler-friendly,' such as keeping props serializable and deriving values during render to avoid unnecessary ref stashing.

When should I use React Actions versus TanStack Query?

The skill recommends React Actions for form-centric mutations and SSR/RSC applications, while suggesting TanStack Query for complex SPAs that require advanced caching or non-form mutations.

React 19 Patterns & Best Practices

Name: React 19 Patterns & Best Practices
Author: MadAppGang

byMadAppGang

•

177

开发者工具

Implement modern React 19 features including the React Compiler, Server Actions, and the new use hook with optimized architectural patterns.

关于

This skill provides specialized guidance for developing with React 19, focusing on high-performance component patterns that leverage the new React Compiler's automatic memoization. It helps developers navigate the technical choice between native React Actions and TanStack Query for state mutations, implements robust form handling with useActionState, and demonstrates efficient data fetching using the use hook and Suspense. Whether you are migrating an existing codebase or starting fresh, this skill ensures your implementation follows the latest industry standards for performance, type safety, and maintainability.

主要功能

Compiler-friendly code patterns to maximize automatic performance optimizations
Optimistic UI patterns using the useOptimistic hook for better user experience
177 GitHub stars
Promise and Context unwrapping techniques using the new use hook
Standardized implementation of React 19 Actions for form-centric mutations
Architectural decision guides for choosing between Actions and TanStack Query

使用场景

Refactoring data fetching logic to utilize Suspense and the use hook for cleaner component code
Building robust, accessible forms with built-in validation and server-side state
Modernizing a React 18 application to leverage the React Compiler and remove manual memoization

关于

主要功能

Compiler-friendly code patterns to maximize automatic performance optimizations
Optimistic UI patterns using the useOptimistic hook for better user experience
177 GitHub stars
Promise and Context unwrapping techniques using the new use hook
Standardized implementation of React 19 Actions for form-centric mutations
Architectural decision guides for choosing between Actions and TanStack Query

使用场景

Refactoring data fetching logic to utilize Suspense and the use hook for cleaner component code
Building robust, accessible forms with built-in validation and server-side state
Modernizing a React 18 application to leverage the React Compiler and remove manual memoization