24 Jun 2025, 09:15 UTC≈3,900 views30 reactionsread 7 August 2026 Реактивность – это легко
Стандартный useContext заставляет обновляться все компоненты-потребители, даже если им не нужна изменившаяся часть состояния. Это приводит к лишним ре-рендерам, особенно в больших компонентах вроде таблиц или списков.
Автор статьи столкнулся с этим в MUI X Data Grid: клик по одной ячейке вызывал ре-рендер всех остальных. Решение — точечная подписка через селекторы
Вместо того, чтобы хранит…
👎20👍7❤3
17 Jun 2025, 09:20 UTC≈3,360 views12 reactionsread 7 August 2026 Остерегайтесь скрытых проблем при работе с search params
Типо-безопасность — это только вершина айсберга, о которой вспоминают разработчики при работе с search params. Автор библиотеки nuqs предупреждает о скрытых проблемах при работе с search params.
Запись и чтение. Для получения типо-безопасного стейта search params необходимо внедрять библиотеки валидации (например Zod). Для записи в search params сложных стейт…
👍11❤1
4 Jun 2025, 09:20 UTC≈3,010 views27 reactionsread 7 August 2026 Почему Error Boundary, а не просто try/catch для компонентов
В React нельзя использовать try/catch чтобы отловить ошибки рендера компонента. Это связано с тем, что React не вызывает функцию Calculator когда он создает элемент, он лишь создает описание того что надо отрендерить.
const element = (
<div>
<h1>Calculator</h1>
<Calculator left={1} operator="+" right={2} />
<Calculator left={1} operator="-" right=…
🔥13👍8❤6
29 May 2025, 09:25 UTC≈2,910 views30 reactionsread 7 August 2026 Анонс TypeScript Native
Вышла превью версия TypeScript написанная на Go. Ее можно установить через npm:
npm install -D @typescript/native-preview
Этот пакет предоставляет команду tsgo – он работает аналогично команде tsc. Со временем команда tsgo переименуется в tsc и переедет в пакет typescript. Сейчас команды разделены для удобства тестирования.
Помимо команды tsgo появилось расширение в VS Code для использован…
👍24🔥4❤2
27 May 2025, 09:34 UTC≈2,740 views33 reactionsread 7 August 2026 Управление фокусом в React с помощью flushSync
Установить фокус на инпуте сразу в React может оказаться не так просто, как кажется. При изменении стейта, React не сразу ре-рендерит компонент, а вместо этого он складывает в очередь все изменения состояний и выполняет их разом после завершения работы обработчика событий. Из-за такого поведения могут возникнуть непредвиденные ситуации, например:
function MyComponent(…
👍29❤2🔥2
15 May 2025, 09:32 UTC≈2,850 views31 reactionsread 7 August 2026 TanStack DB
TanStack представила новую библиотеку – TanStack DB – реактивный клиентский стор, с возможностью синка API запросов. Библиотека работает поверх TanStack Query и расширяет его функционал. Разработчики обещают быструю скорость работы библиотеки, даже на больших объемах данных.
Библиотека предлагает fine-grained реактивность, возможность нормализации данных и примитивы транзакций.
Примеры использования:
…
👍17🔥8👎5❤1
13 May 2025, 09:35 UTC≈2,210 views12 reactionsread 7 August 2026 Родители и владельцы в React: провайдеры контекста
Джулс Блом в своем блоге написала про то, что понимание того, как компоненты-родители (parent) и компоненты-владельцы (owner) влияют на обновление контекста, может помочь писать более производительные провайдеры контекста.
Чтобы провайдеры контекста со стейтом были производительными, надо чтобы провайдер с логикой изменения стейта был отдельным компонентом и приним…
👍12
29 Apr 2025, 09:45 UTC≈2,410 views16 reactionsread 7 August 2026 React Labs: View Transitions, Activity, и другое
В React Labs представили два новых экспериментальных API: View Transitions и Activity. Подробнее о каждой из них:
View Transitions предназначен для анимации переходов в приложении. С ее помощью можно декларативно объявить, что анимировать, когда и как. Пример:
// «Что» анимировать
<ViewTransition>
<div>animate me</div>
</ViewTransition>
Чтобы определить «когда»…
🔥9👍6👎1
22 Apr 2025, 09:50 UTC≈2,500 views29 reactionsread 7 August 2026 Показ тостов через React Server Components
В блоге Build UI показали пример, как, используя React Server Components, показывать всплывающие сообщения (тосты) на клиенте. В примере используются серверные функции, куки и useOptimistic. По итогу, чтобы вызвать тост на клиенте, достаточно в любой серверной функции сделать вызов функции toast, пример:
"use server";
export async function save() {
await toast("Blog po…
👎25👍4
17 Apr 2025, 09:55 UTC≈2,810 views20 reactionsread 7 August 2026 Кейсы оптимизации React
Обзор примеров, показывающих, как пять разных команд разработчиков оптимизировали React. Например, у одной из команд на проекте был плохой показатель метрики INP, которая отслеживает скорость отклика сайта. Хорошим считается отклик менее 200мс, на проекте был отклик 380мс. Какие были найдены причины:
- Большой бандл. Первоначально грузился большой бандл с кодом, который не был нужен. Помог c…
👍20
15 Apr 2025, 10:03 UTC≈3,040 views42 reactionsread 7 August 2026 TypeScript перепишут на Go
Новую версию TypeScript перепишут на Go. Это связано в первую очередь со скоростью работы. TypeScript медленно работает на больших кодовых базах. Особенно это замечается при рефакторинге кода в VS Code, например когда переименовываешь переменную или ищешь все ссылки на интерфейс.
По заверениям Андерса Хейлсберга, при использовании компилятора на Go, скорость работы команды tsc увеличивает…
👍32🔥7👎3
25 Feb 2025, 09:21 UTC≈3,530 views7 reactionsread 7 August 2026 API captureOwnerStack
Недавно вышедший экспериментальный API React теперь официально задокументирован и без флага. Этот API особенно полезно библиотекам и фреймворкам, поскольку позволяет дополнить вывод ошибки пользователю.
API доступно только в development режиме и считывает текущий Owner Stack и возвращает его в виде строки. Пример:
import * as React from 'react';
function Component() {
if (process.env.NODE…
👍6❤1
Showing the 12 most recent of 20 posts we hold for @ru_react_notes. View and reaction counts are the latest single reading for each post, not a live figure, and a recent post is still accumulating both. A view count marked ≈ was rounded by Telegram before we ever saw it — t.me prints views in full below 1,000 and to three significant figures above, so ≈1,200,000 means somewhere between 1,150,000 and 1,249,999. Unmarked counts are exact. Text is reproduced from the public post preview and truncated for length.