Верстальщик от бога

Старые и новые проблемы Safari на iOS #почитать Safari — новый Internet Explorer для фронтенд-разработчиков! Поведение вёрстки в нём отличается от спецификаций, а иногда бывает и непредсказуемым. Но если Microsoft свой браузер похоронила, то Apple регулярно обновляет Safari, создавая новые проблемы для фронтендеров. Релиз Safari 26.0 не стал исключением, а усложнил ситуацию новый дизайн Liquid Glass, изменивший интерфейс браузера. ⏱Читать статью

Дорогие джуны, не делайте так. Коллекция плохих привычек в HTML и CSS #почитать Давно я ничего не писал для джунов. А ведь HTML и CSS не стали проще для них. Всё так же есть сложности, и мне надо как-то помочь людям. Я выделил несколько привычек, от которых лучше избавиться в самом начале карьеры фронтендера — главное, просто сделать это. Надеюсь, вам будет полезно. ⏱Читать статью

Интересные HTML и CSS фичи, которые почему-то обходят стороной #почитать Во фронтенде изменения происходят постоянно. Только разобрался с одним инструментом, он уже считается устаревшим. Плюс на смену ему появляются новые. В JavaScript регулярно добавляются новые методы и API, а HTML и CSS, разумеется, не отстают. Неудивительно, что в этом постоянном круговороте часть возможностей проходит мимо или просто забывается. В этой статье я собрал несколько таких фич, о которых, по моему опыту, разработчики забыли. ⏱Читать статью

Хватит использовать JavaScript для решения задач CSS #почитать Недостаток знаний часто подталкивает людей к чрезмерно сложным решениям, и рано или поздно это отражается на производительности. Возьмем content-visibility: auto. Он дает тот же эффект, что и React-Window, но без единой строчки JS и без увеличения размера сборки. Аналогичная ситуация с современными единицами высоты окна (dvh, svh, lvh): наконец-то приведена в порядок "мобильная" высота, которую годами пытались компенсировать через window.innerHeight. Обе технологии в 2024 году получили более 90% поддержки современных браузеров и полностью готовы для продакшна. Однако мы по привычке продолжаем решать такие задачи с помощью JS, просто потому, что CSS незаметно ушел вперед, пока мы спорили о React Server Components. ⏱Читать статью

Улучшаем API для Resize Observer #почитать Интерфейсы слежения за изменением размера (Resize Observer), изменениями DOM (Mutation Observer) и пересечениями (Intersection Observer) — это полезные API, которые превосходят своих предшественников по производительности: ResizeObserver лучше события window.resize. MutationObserver заменил устаревшие обработчики изменений (Mutation Events). IntersectionObserver позволяет реализовать взаимодействие при прокрутке страницы с меньшими расходами по производительности. API этих трех типов интерфейсов похожи друг на друга (хотя и имеют различия, о которых поговорим позже). ⏱Читать статью

⚠️Хотите разобраться, как обучать интеллектуальных агентов в нестандартных задачах для бизнеса? Начните обучение на курсе «Reinforcement Learning». 🎁Записывайтесь на 3 бесплатных вебинара — познакомьтесь с программой обучения и преподавателями. Задайте свои вопросы экспертам! Вебинар 1: «Обучение с подкреплением - гибкий подход для сложных задач. Создаем собственные окружения». ⏰7 июля в 20:00 мск Программа вебинара: 1. Краткое введение в обучение с подкреплением. 2. Обзор существующих сред и переход к созданию собственного RL-окружения на Python. 3. Напишем свою среду на основе gym.Env и подключим к ней обучающегося агента. Вебинар 2: «Visual DQN: Как научить ИИ-модель видеть мир глазами игрока». ⏰15 июля в 20:00 мск Программа вебинара: 1. Разберем, как DQN работает с изображениями: как агент получает состояние не в виде чисел, а в виде сырых пикселей с экрана. 2. Изучим архитектуру DeepMind-подхода. 3. Запустим обучение DQN в среде Atari Pinball и посмотрим, как агент постепенно учится играть лучше человека. Вебинар 3: «Алгоритм DQN - учим нейросеть принимать решение без помощи человека». ⏰21 июля в 20:00 мск Программа вебинара: 1. Разберем устройство алгоритма DQN: как нейросеть заменяет Q-таблицу и учится выбирать лучшие действия. 2. Изучим ключевые механизмы DQN. 3. Обучим агента решать задачу в среде Gymnasium и проанализируем процесс обучения. Записывайтесь ➡️ https://vk.cc/cZn7g2 Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576

Обрезка блоков текста с помощью line-clamp #почитать Функция line-clamp находится в статусе ограниченной доступности в Baseline, но уже широко используется для создания аккуратных текстовых блоков. Это свойство позволяет ограничить отображение текста заданным количеством строк, скрывая всё, что выходит за пределы. Оно идеально подходит для превью статей, цитат или карточек товаров, где нужно показать только часть текста, не перегружая страницу. ⏱Читать статью

There is No Need to Trap Focus on a Dialog Element #почитать Accessibility advice around modals have commonly taught us to trap focus within the modal. Upon further research, it seems like we no longer need to trap focus within the <dialog> (even in modal mode). ⏱Читать статью

Зачем фавиконов нужно аж 24 штуки? #почитать Для каждого экрана, устройства и программы нужен свой размер фавикон изображения. Из статьи вы узнаете различные трюки, используемые для генерации фавикон, и об удобных инструментах для автоматической генерации. ⏱Читать статью

AI-инструменты можно любить и ненавидеть, но работать без них в IT уже практически невозможно 🤩 Коллеги из AvitoTech 11 июля зовут в их офис на Лесной на AI Hardcore Day. Приглашают тех, кто каждый день сталкивается с AI в работе и даже пишет своих AI-агентов. Обещают доклады и нетворкинг-сессию на террасе после — и всё это без записи. 💫 Среди тем: — Spec-Driven Development: теория, инструменты, практика. — Разработка и тестирование MCP для внутренних агентных систем аналитики. — Выпрямляем руки агентов: как сделать MCP удобными и действительно полезными. — Атаки на GenAI-агентов: OWASP на практике. ➡ Регистрация тут!