Как измеряется производительность CSS модулей?

У CSS Modules почти нет затрат во время работы: это обычный CSS, поэтому производительность измеряют теми же метриками, что и любые стили.

Что измерять

• Размер CSS — сколько стилей загружает страница (DevTools → Network, отчёт бандлера).
• Покрытие — какая доля загруженного CSS реально используется (DevTools → Coverage).
• Время до отрисовки — FCP и LCP в Lighthouse или WebPageTest: блокирующий CSS их задерживает.
• Время пересчёта стилей — DevTools → Performance, блоки Recalculate Style.

Чем CSS Modules помогают

• стили разбиваются по компонентам и попадают в чанки страниц;
• неиспользуемые компоненты не тянут свои стили;
• нет рантайма, в отличие от многих CSS-in-JS.

На что обратить внимание

• одинаковые стили в разных модулях дублируются — общие вещи выносят в общие файлы или переменные;
• много мелких CSS-файлов — больше запросов без HTTP/2.

Коротко для собеседования

CSS Modules — обычный CSS без рантайма; измеряют размер и покрытие CSS, FCP/LCP и время пересчёта стилей.

Подробнее: Chrome DevTools — Coverage