Заметки о Frontend, Backend и немного DevOps. В основном о PHP, Laravel, JavaScript, CSS, тестировании кода и настройке серверов.
<img> кажется простым, но его неправильное использование — одна из частых причин проблем с производительностью: смещение макета, загрузка тяжёлых изображений на мобильные устройства, медленный LCP. Руководство объясняет, как и почему браузер работает с изображениями: от указания размеров и адаптивности через srcset с sizes до современных форматов в <picture>, управления приоритетами загрузки и стратегий для LCP с предварительной загрузкой.
EXCLUDE, GENERATED) берут на себя проверки целостности. Выразительные средства языка (DISTINCT ON, FILTER, рекурсивные CTE) делают запросы компактнее. А выбор между JSONB и композитными типами открывает разные пути моделирования данных — от полной гибкости до строгой схемы.
:where() для снижения специфичности одного селектора, но знали ли вы, что можно добиться аналогичного эффекта сразу для нескольких правил?
alt изображения от подписи figcaption, которая размещается в элементе <figure>?
input.value и getAttribute('value') возвращают разные значения и как писать надёжный код.
Symbol.iterator, next(), for...of? Создание своих итераторов и ленивые вычисления. С примерами кода и ссылками на смежные статьи.
.ts файла. Рассмотрим пошаговую настройку окружения, основные приёмы типизации переменных, функций и DOM-элементов, создание собственных типов с @typedef, а также следующие шаги — от автоматической проверки в CI до генерации .d.ts файлов. Все примеры адаптированы для самостоятельного повторения.
@scope. Это означает, что технология получила статус Baseline Newly Available и готова к промышленному использованию во всех современных браузерах без исключений.
@layer) предоставляют эффективный механизм управления специфичностью и порядком применения стилей. Однако существующие материалы обычно демонстрируют их использование на новых проектах, тогда как большинство разработчиков работает с унаследованной кодовой базой. В статье на примере реального сайта рассматривается пошаговая стратегия внедрения Cascade Layers в существующий проект: от подготовительного рефакторинга до построения финальной архитектуры слоёв и решения сложных вопросов, возникающих в процессе миграции.
block__element--modifier? Или смирились с тысячами утилит в HTML? @scope позволяет оставить и классы, и утилиты, но забыть о войнах специфичности. Вот 3 сценария, где @scope меняет правила игры, и точный план внедрения в ваш проект.