Как писать стили в 2026: CSS Modules, CSS-in-JS, Tailwind и zero-runtime
Habr ·
Всем привет! Меня зовут Даниил Николаев и я frontend-разработчик в компании " Исходный Код " На каждом kickoff нового проекта всплывает один и тот же сценарий: один разработчик топит за утилиты Tailwind , второй отстаивает чистоту и надежность CSS Modules, третий по привычке тянет проверенный CSS-in-JS , а кто-то просто молча открывает .scss и выходит из созвона. В этой статье мы опустим споры о «красивом синтаксисе» и разберем инженерную сторону вопроса: кто на самом деле платит за динамику — сборка или браузер клиента. Заглянем под капот ключевым подходам в мире React (для уровня middle и middle+): разберем классические CSS Modules , ушедший в maintenance mode styled-components , Emotion, современный Tailwind v4 на движке Oxide и перспективный zero-runtime (Linaria, Vanilla Extract). Посмотрим, что реально происходит с CSSOM , reflow и рендером в браузере, а в конце — соберем практическую матрицу выбора без фанатизма и хайпа месяца. Читать далее
Всем привет! Меня зовут Даниил Николаев и я frontend-разработчик в компании " Исходный Код " На каждом kickoff нового проекта всплывает один и тот же сценарий: один разработчик топит за утилиты Tailwind , второй отстаивает чистоту и надежность CSS Modules, третий по привычке тянет проверенный CSS-in-JS , а кто-то просто молча открывает .scss и выходит из созвона. В этой статье мы опустим споры о «красивом синтаксисе» и разберем инженерную сторону вопроса: кто на самом деле платит за динамику — сборка или браузер клиента. Заглянем под капот ключевым подходам в мире React (для уровня middle и middle+): разберем классические CSS Modules , ушедший в maintenance mode styled-components , Emotion, современный Tailwind v4 на движке Oxide и перспективный zero-runtime (Linaria, Vanilla Extract). Посмотрим, что реально происходит с CSSOM , reflow и рендером в браузере, а в конце — соберем практическую матрицу выбора без фанатизма и хайпа месяца. Читать далее