Кодик
Начать бесплатно

Preact 11 Beta: лёгкий React без багажа

Hydration 2.0, настоящие Ref и прощание с легаси — в новой бете Preact разработчики сделали мини-React ещё быстрее и удобнее. Простыми словами разберём, зачем обновляться и что это меняет для фронтенда.

Разработка

6 мин

Если React — это «основной боинг» фронтенда, то Preact всегда был его ультра-лёгким спортивным самолётом. И вот вышла Preact 11 Beta - и у нас реально новый виток: Hydration 2.0, поддержка Ref и отказ от легаси-хлама. Давайте посмотрим, что это значит простыми словами.

Hydration 2.0 — больше никакой каши при старте

Hydration — это момент, когда HTML от сервера оживает в браузере, превращаясь в интерактивное приложение. В React и старом Preact иногда были баги: дублирование узлов, странные «дергания» при загрузке.

Теперь:

  • Алгоритм стал умнее и быстрее.

  • Совпадение HTML и клиентского состояния работает без сюрпризов.

  • SSR-приложения загружаются плавно, как будто у вас в руках butter-UI 🧈.

Итог: меньше багов, меньше костылей, быстрее first paint.

Поддержка Ref — наконец-то!

Preact всегда гордился совместимостью с React-экосистемой, но кое-чего не хватало. Теперь можно писать:

import { useRef } from 'preact/hooks';

function App() {
  const inputRef = useRef();

  return <input ref={inputRef} placeholder="Напиши что-нибудь" />;
}

Refs работают по-настоящему, а не через обходные пути. Значит, переносить код из React стало ещё проще.

До свидания, легаси

В новой версии команда Preact решила выбросить часть старого, сомнительного кода:

  • Убрали хаки, которые держали обратную совместимость со старыми API.

  • Почистили внутренности: меньше условностей и сюрпризов.

  • Код стал компактнее и быстрее.

Итог: меньше хлама — чище будущее.

React vs Preact 11

Чем отличается классический React от свежего Preact 11 Beta:

Критерий

React

Preact 11 Beta

Размер бандла

~40+ КБ gzip

~3 КБ gzip

Hydration

Классическая, с возможными глитчами

Hydration 2.0, стабильнее и быстрее

Refs

Полная поддержка

Теперь поддерживаются (новинка 🎉)

Совместимость экосистемы

100% (React экосистема)

Очень высокая, теперь ближе к 1:1

Легаси

Много обратной совместимости

Срезали старьё, чище кодовая база

Чем это важно для разработчиков

  • Если у вас SSR или ISR — Hydration 2.0 даст реальный прирост качества.

  • Если используете библиотеки из React-мира — поддержка Ref снимает боль.

  • Если хотите минимальный бандл и скорость — Preact остаётся чемпионом.

В Кодике мы всегда следим за такими апдейтами. Наш девиз — объяснять сложные штуки простыми словами, чтобы любой мог вкатиться в современные фреймворки без лишнего стресса.

В приложении есть курсы по JavaScript и фронтенду, а в телеграм-канале мы обсуждаем новости вроде Preact 11 Beta.

📲 Присоединяйся и прокачивайся с нами!

Комментарии