Что такое CSS-in-JS

CSS-in-JS — это подход, при котором стили пишутся непосредственно в JavaScript-коде, а не в отдельных CSS-файлах. Это позволяет динамически генерировать стили на основе пропсов, состояний или тем, а также решает проблемы изоляции стилей и глобального пространства имён. Пример с библиотекой `styled-components`: ```jsx import styled from 'styled-components'; const Button = styled.button` background: ${props => props.primary ? 'blue' : 'gray'}; color: white; padding: 10px 20px; `; // Использование Click ``` **Преимущества:** - Изоляция стилей (нет конфликтов классов) - Динамические стили на основе пропсов/состояний - Удобное темирование - Автопрефиксинг и минификация из коробки **Недостатки:** - Увеличение размера бандла - Сложность в SSR - Меньшая производительность по сравнению с чистым CSS Популярные библиотеки: styled-components, Emotion, JSS.