Какие знаешь проблемы CSS-in-JS

1. Производительность: CSS-in-JS может замедлять рендеринг из-за динамической генерации стилей в рантайме. Например, styled-components или emotion добавляют накладные расходы.

2. SSR (Server-Side Rendering): Некоторые решения требуют дополнительной настройки для корректной работы с SSR, что усложняет проект.

3. DevTools: Отладка стилей сложнее, так как классы генерируются динамически и могут быть нечитаемыми.

4. Bundle Size: Библиотеки добавляют лишний вес в сборку по сравнению с чистым CSS.

5. Изоляция стилей: Хотя это плюс, иногда приводит к дублированию кода, если одни и те же стили используются в разных компонентах.

Пример с styled-components:

const Button = styled.button`
  background: ${props => props.primary ? 'blue' : 'gray'};
  // При частом изменении пропсов могут быть проблемы с перфомансом
`;

Лучше использовать для небольших проектов или компонентов с динамическими стилями.