Frontender's notes

Собственные функции в CSS Принято считать, что CSS — это про декларации, а не про логику. Если нужна логика — идёшь в JS или препроцессоры. Но CSS постепенно становится умнее. И один из самых интересных шагов в эту сторону — function. Что это вообще такое Идея простая: возможность объявлять свои функции прямо в CSS и переиспользовать вычисления. Что-то вроде:

    
        
@function --spacing($step) {
  @return calc($step * 8px);
}

.card {
  padding: --spacing(2);
}
{}
    

Это попытка сделать CSS более выразительным без ухода в Sass или JS. Зачем это нужно Повторяемые вычисления Все эти calc(...) быстро начинают дублироваться. С функциями: 👉 меньше копипасты 👉 единая логика расчёта Дизайн-система в коде Можно зашить правила прямо в стили:

    
        
@function --radius($size) {
  @return clamp(4px, $size * 1px, 16px);
}
{}
    

И использовать везде одинаково. Меньше зависимости от препроцессоров Часть логики, ради которой раньше брали Sass, можно держать нативно. Но есть нюанс 👉 поддержка браузерами ограничена 👉 синтаксис может меняться 👉 в проде использовать нужно осторожно Это всё ещё экспериментальная история. И важный момент CSS-функции — это не полноценный язык программирования. Нельзя: 👉 писать сложные ветвления 👉 хранить состояние 👉 делать побочные эффекты Это именно про вычисления значений. Где это может быть полезно 👉 токены дизайн-системы 👉 отступы, размеры, сетки 👉 адаптивные значения 👉 повторяемые формулы Там, где сейчас много calc и дублирования.

А не приходило кому-то мысля что ии просто пытался сбежать?) 💥 xCode Journal

Shared как архитектурная свалка: как понять, что вы уже проиграли Есть момент, после которого shared перестаёт быть полезным слоем и превращается в тихую архитектурную катастрофу. Обычно это происходит незаметно. Как выглядит «здоровый» shared

Изначально всё звучит правильно: 👉 переиспользуемый код 👉 общие утилиты 👉 базовые компоненты Маленький, понятный слой без привязки к бизнесу. Когда всё начинает ломаться Первый сигнал — в shared начинают складывать «временно». 👉 «потом разберём» 👉 «пока пусть полежит тут» 👉 «вдруг ещё пригодится» И слой начинает расти без контроля. Симптомы, что вы уже в проблеме Нет границ В shared лежит всё: 👉 UI 👉 бизнес-логика 👉 работа с API 👉 куски стора Слой перестаёт быть абстракцией. Невозможно понять, что можно использовать Файлов много, названия размытые: 👉 helpers 👉 common 👉 utils2 Чтобы что-то найти — нужно читать код. Любая правка — риск Меняешь одну функцию — ломается половина проекта. Потому что зависимости неочевидны. Фича не может жить без shared Любая новая фича тянет за собой кучу зависимостей из shared. Это уже не shared. Это скрытый монолит. Почему это происходит 👉 нет правил, что туда можно класть 👉 нет владельца 👉 нет ревью на уровне архитектуры 👉 удобство побеждает структуру shared становится «быстрым решением». Как понять, что точка невозврата близко 👉 вы боитесь удалять код из shared 👉 появляются версии вроде utils_new 👉 код дублируется, но никто не хочет трогать старый 👉 обсуждения «куда положить файл» занимают больше времени, чем реализация

Что с этим делать

👉 жёстко ограничить контракт shared 👉 выносить доменную логику обратно в фичи 👉 дробить слой по смыслу 👉 вводить владельцев или ревью Иногда единственный вариант — начать вычищать постепенно.

Главная мысль shared не становится свалкой за один день. Он становится ей из-за отсутствия правил. Если слой: 👉 растёт быстрее фич 👉 становится менее понятным со временем 👉 начинает тормозить разработку Скорее всего, вы уже проиграли.

🤣 Примеры полиморфизма на собеседовании: 💥 xCode Journal

🐱 На GitHub выкатили andrej-karpathy-skills Скилл из 4 инструкций, которые меняют поведение Claude Code. Благодаря им модель больше планирует, проверяет себя, пишет аккуратнее и меньше галлюцинирует. Автор вдохновился размышлениями отца вайбкодинга и формализовал его подход к работе с кодом и ИИ. Чтобы вы понимали — репа набрала почти 40 тысяч звезд за пару дней. ✖️ xCode Journal

Канал для IT-спецов о том, как запустить свой проект Даже если у тебя нет готовой идеи и все прошлые попытки провалились. Ты узнаешь: Как заранее понять, будет ли кто-то платить за твой продукт? Как выбрать идею, которая "выстрелит"? Как получить первые оплаты, еще ДО создания продукта - и не заплатить за это ни копейки. Если тебе уже надоело тратить жизнь, работая в корпорации, и есть желание "сделать что-то своё", но уходить строить бизнес страшно - ты в правильном месте. Подписаться #реклама 16+ О рекламодателе

💸 Сооснователь GitHub поднял $17 млн на нового Git-клиента Скотт Чакон считает, что классический Git УСТАРЕЛ И плохо работает в мире, где код пишут не только люди, но и ИИ-агенты. Поэтому он создал пару лет назад GitButler и теперь выкатил CLI-версию. Главная его идея — более удобный интерфейс и отсутствие классического переключения между ветками + параллельная работа. Вообще внутри много прикольных фич — сразу видно, что разрабатывал не новичок ✖️ xCode Journal

Почему сложный CSS чаще бьёт по CPU, чем тяжёлый JavaScript Принято считать, что если страница тормозит — значит виноват JavaScript. Логично: там логика, вычисления, всё «сложное». Но на практике часто оказывается, что упираемся не в JS, а в CSS. CSS работает не один раз JavaScript обычно выполняется точечно: 👉 при загрузке 👉 при событии 👉 при вычислении Отработал — и закончил. CSS живёт иначе. Он участвует в каждом изменении интерфейса. Любой скролл, hover или обновление состояния может запускать: 👉 перерасчёт стилей 👉 layout 👉 paint Если стили сложные — браузер платит за это постоянно. Селекторы — это тоже работа Когда пишешь что-то вроде: .page .content .list li .item .title span браузер не «магически применяет стиль». Он проходит по DOM и проверяет соответствие. Чем глубже и сложнее селектор: 👉 тем больше проверок 👉 тем выше нагрузка Особенно если элементов много. Layout — дорогая операция Некоторые свойства заставляют браузер пересчитывать геометрию: 👉 width / height 👉 margin / padding 👉 top / left 👉 flex / grid Это вызывает reflow. Если это происходит часто — CPU начинает страдать. Paint может быть ещё хуже После layout идёт отрисовка. И вот тут дорогими становятся: 👉 box-shadow 👉 blur 👉 градиенты 👉 backdrop-filter Каждый кадр требует пересчёта пикселей. JavaScript можно контролировать. CSS — сложнее JS можно: 👉 выполнить один раз 👉 закешировать 👉 разбить на части CSS применяется всегда, пока элемент на странице. И если он тяжёлый — он нагружает систему постоянно.

⚡️ Писать код руками больше не нужно! Привет. Меня зовут Кирилл. Я создаю топовые подборки с уроками по AI и вайбкодингу: — 60+ промптов для дебага: поиск ошибок, оптимизация кода — 40 бесплатных курсов по вайбкодингу — 150 гайдов, как использовать ChatGPT, Claude Code, Antigravity, Cursor, Perplexity, Lovable — 100 готовых модулей: авторизация, админки, логирование, тесты, i18n — 37 MCP серверов: дизайн, разработка, Тесты/QA, деплой Всего 10 минут в день на канале и ты научишься вайб-кодить проекты любой сложности. Подписывайся, чтобы получать подборки каждую неделю!

😱 Оказалось, что ИИ газлайтит разработчиков Программист показал несколько кейсов от разных пользователей — у всех одна и та же проблема: Claude Code принимает свои слова за указания человека, а потом действует исходя из них. Так, ИИ посчитал, что пользователь разрешил снести H100. Агент сам «додумал» это согласие, удалил всё и только потом извинился (ну, спасибо). А иногда ИИ даже не признает ошибку и до последнего считает, что команду отправил человек. ✖️ xCode Journal