Команда preact рассказала про разработанные ими сигналы (signal)

Сигнал - это новый (в preact) способ описания стейта, который очень близок к реактивным атомам.

import { signal, computed } from "@preact/signals";

const count = signal(0);
const double = computed(() => count.value * 2);

function Counter() {
  return (
    <button onClick={() => count.value++}>
      {count} x 2 = {double}
    </button>
  );
}

Сигналы - быстры, удобны и мало весят (1.6КБ).

В статье перечисляются минусы традиционных подходов (хуки, селекторы, контексты). Все они сводятся к тому, что из коробки у них либо недостаточно производительности (т.е. нужно делать много дополнительных усилий для достижения оптимальной производительности) либо плохой DX (developer experience) либо и то и то сразу. Сигналы же решают обе проблемы сразу

С точки зрения DX, сигналы очень просты - объяви сигнал, используй его в вёрстке и все будет работать из коробки. С точки зрения разработчика сигнал, как абстракция, немногим сложнее обычной переменной

С точки зрения перформанса, команда preact сделала нативную интеграцию virtual dom и сигналов. Это позволяет при обновлении значения сигнала ререндерить только то, что действительно использует значение из сигнала. При этом они пошли еще дальше и могут определять, когда vdom вообще перестраивать не нужно, достаточно сразу поменять DOM-элемент - это кейс, когда мы связываем сигнал и dom-атрибут

Выглядит очень интересно, а также наглядно показывает, почему вообще появляются реактивные инструменты для создания UI