Мысли и заметки

CDN — Content Delivery Network — это сеть серверов, распределённых по всему миру. Когда пользователь открывает ваш сайт, файлы приходят не с одного центрального сервера, а с ближайшего к нему узла. Это сокращает физическое расстояние, которое проходят данные, и страница загружается быстрее. Звучит просто, но на практике CDN часто рекомендуют там, где он реально не помогает.

Одностраничное приложение — SPA — работает так: браузер скачивает JavaScript-файл, запускает его, и только потом отрисовывает страницу. Пока скрипт не выполнится, пользователь видит пустой экран или спиннер. На быстром ноутбуке с хорошим интернетом это занимает доли секунды. На среднем телефоне с мобильным интернетом — может растянуться на 3–5 секунд. А эти три секунды — момент, когда большинство людей уходит.

Качество анимации — один из самых чётких сигналов, который отличает премиальный продукт от посредственного, даже если пользователь не может объяснить почему. Когда страница ощущается тяжёлой, когда скролл подёргивается, когда hover-эффект мерцает — это проблема производительности, а не дизайна. И почти всегда она из одной и той же причины: JavaScript делает работу, которую не должен делать.

TypeScript — это JavaScript с аннотациями типов: описаниями того, какие данные хранит переменная или ожидает функция. При сборке TypeScript проверяет, что все эти описания соответствуют реальному коду. Если что-то не совпадает — сборка падает. Это звучит как лишняя работа, но это то же самое трение, что делает ремень безопасности неудобным в застёгивании и катастрофой в отсутствие.

Дизайн-токен — это именованная переменная, которая хранит дизайн-решение. Вместо того чтобы писать hex-цвет #0a0a0e везде в коде, вы пишете --color-surface-primary. Вместо того чтобы жёстко задавать 16px как отступ, вы пишете --spacing-md. Разница кажется небольшой, пока вам не нужно что-то изменить — и тогда она становится огромной. Токены превращают полный день правки в однострочное изменение.

Core Web Vitals — это три метрики, которыми Google измеряет, каково пользователю на самом деле. LCP — Largest Contentful Paint — сколько времени до появления основного контента страницы. INP — Interaction to Next Paint — как быстро страница реагирует на нажатие или клик. CLS — Cumulative Layout Shift — насколько лейаут неожиданно прыгает при загрузке. Вместе они дают разумную оценку того, ощущается ли сайт быстрым и стабильным.