Comments 7
Добрый день. Простите, а можете показать как выглядят страницы для которых css файл весит 3 мегабайта. И с 2000 уникальных для стилизации элементов.
Да, 2000 слишком много. Я посчитал сейчас на разных сайтах. Там от 300 до 700 элементов с уникальным набором классов:
Array.from(document.querySelectorAll('[class]'))
.reduce((a, o) => {
a.add(Array.from(o.classList.values()).sort().join(' '))
return a
}, new Set()).size
Еще я обнаружил ошибку в расчетах. Я не учел, что CSS пишется для уникальных элементов, которых гораздо меньше чем всех. И результаты противоположны полученным мной, чистый CSS + BEM оказался экономичнее даже без обфускации и оптимизации. Я исправлю тогда статью.
статью исправил
В целом tw скорее utility only, а не utility firts. сложность макета должна где-то существовать, это стоит учитывать при дальнейшей поддержке или переиспользовании макета. Либо во всяких sass, либо четко ограниченная дизайн системой с переиспользуемыми стилями.
Если в целом не нравится много перечислений, есть apply… это всеравно как постояннно народ пихает svg одинаковые на странице разными экземплярами, когда можно реюзнуть через символы вставив иконку полностью только один раз.
А размеры указаны с учётом сжатия? Например с gzip и brotli
Tailwind vs BEM — 1 (сравнение производительности)