DNS и хостинг
Тема дорожной карты · Frontend разработчик
DNS-хостинг (Domain Name System) — это сервис, хранящий и отдающий авторитетные DNS-записи для домена, транслируя человекочитаемые имена хостов вроде devroadmap.ru в IP-адреса, которые браузеры и другие сетевые клиенты используют для подключения к веб-серверам. Типы DNS-записей, которые должен понимать каждый frontend-разработчик: A (IPv4-адрес), AAAA (IPv6-адрес), CNAME (псевдоним, используется для указания поддомена на CDN или хостинг-провайдер), MX (почтовый обменник) и TXT (верификация SPF, DKIM). Значения TTL (time-to-live) DNS определяют, как долго записи кэшируются резолверами — короткие TTL (60–300 сек.) позволяют быстро переключаться при развёртывании, тогда как длинные TTL снижают задержку DNS-поиска для конечных пользователей. Веб-хостинг объединяет настройку DNS с серверной инфраструктурой: статические frontend-приложения, собранные с Vite или Webpack, как правило, размещаются в объектном хранилище с CDN перед ним, тогда как SSR-фреймворки Next.js или Astro требуют Node.js-рантайма или платформы serverless-функций.
Как это работает
DNS и хостинг покрывает взаимодействие браузера и сервера: браузер резолвит DNS, открывает TCP+TLS, шлёт HTTP-запрос, получает HTML, парсит (строит DOM и CSSOM), исполняет JavaScript, делает layout + paint, показывает пиксели. Современные браузеры гонят JS в main thread, но network, парсинг, layout, paint, composit выносят на другие потоки. URL идентифицируют ресурсы; HTTP их доставляет; cookie + localStorage держат state на клиенте.
Когда применять
Понимание основ веба обязательно для серьёзной frontend-работы — каждый perf-баг, каждое "локально работает, в проде нет", каждая accessibility-проблема сводится к примитиву браузера. Прочтите MDN-разделы про HTTP, DOM, render pipeline один раз; возвращайтесь при отладке. Тестируйте в нескольких браузерах (Chrome, Firefox, Safari mobile + desktop) — они отличаются сильнее, чем признают.
Типичные ошибки
Ловушки DNS и хостинг: расчёт, что поведение Chrome = "веб" (Safari ≠ Chrome, и Safari — единственный движок iOS); игнор cache-заголовков и огромные бандлы на каждый load; вера в "у меня на быстром wifi работает" — реальные пользователи на 3G mobile — другая планета; непонимание разницы render-путей (SSR / SSG / CSR / hydration). Профилируйте в Chrome DevTools Performance; timeline не врёт.