Тихие блокеры в robots.txt: как ошибки могут незаметно убрать сайт из Google

Неправильный .robots.txt может остановить обход страниц или скрыть важные директории, из-за чего контент не попадает в поиск. Разбираем типовые ошибки вроде Disallow: /, блокировок ресурсов и синтаксических опечаток, и проверяем конфиг через инструменты Google.

https://dev.to/freedevkit/the-silent-blockers-how-robotstxt-mistakes-can-ghost-your-site-from-google-12h0

Codemod в JavaScript: меняйте сотни файлов без боли с jscodeshift

Когда в проекте постоянно меняются API, синтаксис и UI-kit, спасает подход “меняем код машиной”: jscodeshift строит AST и позволяет делать предсказуемые трансформации сразу по всем файлам — вместо опасного поиска-замены и regex.

https://habr.com/ru/companies/banki/articles/1011580

Masonry на Flexbox: раскладываем элементы по строкам с точной математикой

Разбираем, как Flexbox распределяет свободное место между flex-элементами (grow/shrink), чтобы собрать “мозаичный” layout из карточек разной высоты при известном aspect ratio. Освоим логику расчёта для каждой строки и сможем воспроизвести masonry-эффект без тяжёлых фреймворков.

https://frontendmasters.com/blog/flexbox-masonry-layout-explained-with-math/

Event Loop для начинающих — разбор без страха

JavaScript выполняется в одном потоке, но браузер/окружение берут на себя асинхронщину: таймеры, клики, сети и Promise. Разберём, как Event Loop управляет очередями задач и микрозадачами, почему стек вызовов работает по принципу LIFO и как микрозадачи могут блокировать рендер.

https://habr.com/ru/articles/1011258

Собрали open-source SVG-библиотеку брендов с 4 700+ иконками

Единый источник SVG-логотипов и облачных диаграмм: поиск, версии, CDN/CLI/API и типизированные пакеты для React/Vue/Svelte. Импортируйте только нужные иконки, используйте варианты (color/mono/light/dark/wordmark) и интегрируйте в приложения без боли.

https://github.com/glincker/thesvg

Гибридный поиск: объединяем semantic и lexical, чтобы находить точные вещи и смысл одновременно

Использование одной семантики ведет к промахам по точным названиям, API и ключевым терминам . Решение: параллельный запуск lexical и semantic поиска.

https://kentcdodds.com/blog/implementing-hybrid-semantic-lexical-search

!important #7: random(), folded corners, anchored container queries

CSS-дайджест с практичными фишками: генерация значений через random()/random-item(), «сложенные» углы через clip-path, фоновые эффекты backdrop-filter, стабильные числа font-variant-numeric: tabular-nums

https://css-tricks.com/whats-important-7/

Прекратите войну с валидацией форм: JSON Schema как единый источник правды

Дублирование проверок между фронтендом и бэкендом ломает UX и порождает регрессии. Подход schema-driven переносит правила, сообщения и условия показа полей в одну JSON-схему: форма рендерится, валидирует и согласованно проверяется на сервере.

https://blog.logrocket.com/stop-fighting-schema-driven-form-validation/

ESLint пора на пенсию: миграция на Oxlint для скорости и удобства

ESLint в больших репозиториях превращается в узкое горлышко: медленно прогоняет проверки и требует сложной настройки. Oxlint — быстрый линтер на Rust с большим числом правил по умолчанию и поддержкой type-aware linting, так что CI и локальная разработка ускоряются, а порог входа заметно снижается.

https://blog.logrocket.com/retire-eslint-migrate-oxlint/

Нативные JSON-модули наконец-то заработали по-настоящему

Теперь JSON можно импортировать как полноценные ES-модули:
import config from "./config.json" with { type: "json" }.

Разбор происходит в runtime, включается стандартный кэш ESM и исчезают лишние трансформации/loader’ы — а сборщики становятся опциональными.

https://allthingssmitty.com/2026/03/16/native-json-modules-are-finally-real/

focusgroup в HTML: декларативная навигация стрелками без роувинг-tabindex

focusgroup — атрибут, который добавляет arrow-key навигацию для составных виджетов (toolbar, tablist, menu и т.д.) без ручной настройки tabindex. В браузере остаются только ваши прикладные состояния, а направление, и восстановление фокуса берёт на себя платформа.

https://developer.chrome.com/blog/focusgroup-rfc

Три причины раздувания зависимостей в JavaScript

Разбираем три типовых источника dependency bloat: поддержка древних рантаймов, защита от мутаций глобального окружения и кросс realm значения, из за которых в npm деревьях копятся лишние микропакеты. Узнаем, как начать чистить дерево без поломок.

https://43081j.com/2026/03/three-pillars-of-javascript-bloat

Ценность z-index: как перестать жить магическими числами

z-index управляет порядком наложения UI-элементов, но в больших командах быстро превращается в хаос: числа растут, конфликты и отладка усложняются. Разбираем, почему это происходит, как связаны значения и stacking context, и как спасти проект через стандартизацию уровней наложения.

https://css-tricks.com/the-value-of-z-index/

requestAnimationFrame для плавных анимаций

requestAnimationFrame помогает синхронизировать UI-обновления с кадром рендера: меньше дрожания, меньше фризов и стабильнее тайминг. Разберём разницу с setTimeout, момент выполнения в пайплайне браузера (INP/next paint) и где уместны альтернативы вроде scheduler.yield, postTask и requestIdleCallback.

https://www.debugbear.com/blog/requestanimationframe

Inspira UI: open-source компоненты для анимированных интерфейсов на Vue и Nuxt

Библиотека готовых компонентов для создания живых UI-эффектов: анимации, примеры и гибкая кастомизация через Tailwind. Отличный старт, чтобы быстрее собрать интерфейс и подстроить его под дизайн-проекты.

https://inspira-ui.com/

GitHub - privatenumber/minification-benchmarks: 🏃‍♂️🏃‍♀️🏃 JS минфикация в цифрах

Сравнение популярных JS-minifier’ов (SWC, oxc-minify, esbuild, terser, uglify-js, SWC и др.) по размеру после minify и скорости работы: что реально даёт меньший bundle и быстрее ли именно на практике. Отличный ориентир перед выбором инструмента для production-сборок.

https://github.com/privatenumber/minification-benchmarks

Руководство по SVG фильтрам

Познакомимся с SVG фильтрами и посмотрим на их базовые возможности

https://frontendmasters.com/blog/svg-filters-guide-getting-started-with-the-basics/

Сидеть и работать в корпорации — страшно, жизнь-то мимо проходит. Уходить строить бизнес — страшно, а вдруг прогорит. Один из вариантов — разрабатывать свой пет-проект по вечерам. Многие успешные компании, например, Twitter, создавались именно так. Это не значит, что ваш проект обязательно заработает миллиарды, но заработать больше, чем в найме, и получить ценный опыт — вполне реально.

Перед началом разработки появляется множество вопросов, например:

– Как выбрать идею для пет-проекта?
– Что нужно знать про маркетинг?
– Как запуститься и довести до первых продаж не имея бюджета на рекламу?

В телеграм-канале «Твой пет проект», Михаил Табунов делится своим опытом с разработчиками и менеджерами.

Он рассказывает, где искать идею для нового проекта, что нужно знать о маркетинге, как запустить стартап и привлечь первых 10 клиентов, а также о многих других важных вещах.

Подписывайтесь на «Твой пет проект», получайте пользу от практиков рынка!

Моя коллекция полезных HTML-фич

Набор практичных HTML-атрибутов и приёмов для ускорения загрузки и декодирования изображений, корректной локализации текста для скринридеров и удобного отключения интерактивных элементов без костылей. Подойдёт тем, кто хочет прокачать фронтенд на уровне разметки и легко внедрить улучшения в существующие проекты.

https://habr.com/ru/companies/ruvds/articles/1021090

Радио стейт-машина в CSS

Если UI нужно переключать между несколькими визуальными режимами без JS, радио state machine на базе input type radio и селекторов позволяет держать логику прямо рядом с разметкой. Разбираем подход, который заменяет checkbox hack, когда состояний больше двух и важна чистая управляемость интерфейса.

https://css-tricks.com/the-radio-state-machine/

Wiretext - инструмент для юникодных wireframe диаграмм

Wiretext рендерит макеты как символы для рисования, поэтому wireframe и схемы можно быстро собирать в тексте и легко шарить без картинок. Поддерживаются слои, боксы и подписи, удобно для прототипов и документации интерфейсов.

https://wiretext.app/