React

---
name: react
description: React 19 — функциональные компоненты, хуки, правила состояния, мемоизация, Server/Client Components, error boundaries. Use при написании или рефакторинге React-компонентов и хуков.
version: 1.0.0
---

# Навык: React 19

Современный React (по официальной документации react.dev).

## Компоненты и состояние
- Только функциональные компоненты + хуки; чистые компоненты, побочки — в эффектах/обработчиках.
- Состояние минимально и локально; поднимай выше только при реальной необходимости.
- Производное значение — вычисляй при рендере, не дублируй в состоянии.
- Списки — стабильный `key` (не индекс, если порядок меняется).

## Хуки
- Правила хуков: только на верхнем уровне, только из компонентов/хуков.
- `useEffect` — для синхронизации с внешним миром, не для производного состояния; корректные зависимости и cleanup.
- Переиспользуемая логика — в кастомные хуки (`useXxx`).
- React 19: `use()` для промисов/контекста, Actions и `useActionState`/`useOptimistic` для форм и оптимистичных обновлений.

## Мемоизация (по необходимости)
- `useMemo`/`useCallback`/`memo` — после замера, против реальных перерендеров; не заранее.
- React Compiler (если включён) снимает часть ручной мемоизации.

## Server / Client Components
- Server Component по умолчанию; `"use client"` — для интерактивности и браузерных API.
- Не тащи серверные секреты в клиентские компоненты.

## Интернационализация (i18n)
- Пользовательский текст — через `useTranslation`/`t()` (или серверный аналог), не литералами в JSX; ключи типизированы. Множественное число/род — ICU, форматы дат/чисел — `Intl`.
- В мультиязычном проекте — строгий запрет хардкода строк; подробности — скилл **i18n**.

## Надёжность
- Error Boundaries вокруг рискованных поддеревьев; понятный fallback.
- Suspense для асинхронной загрузки; аккуратные состояния loading/empty/error.