[{"data":1,"prerenderedAt":29},["ShallowReactive",2],{"$fVT3S-An4Jx2Zt9jEwz6vQaNmhc0SxWkc29ussiK9BRg":3},{"slug":4,"title":5,"description":6,"date":7,"created_at":8,"updated_at":8,"h1":5,"content":9,"views":10,"next_articles":11},"bitye-css-i-js","Битые CSS и JS","Битые CSS и JavaScript после деплоя: как найти 404 у ассетов, согласовать HTML, manifest и CDN, а также проверить кэш и service worker без догадок.","2026-08-08","2026-09-07","\u003Cp>Битый CSS или JavaScript — не просто запись 404 в консоли. Без стилей страница теряет читаемость, без скрипта ломаются меню, формы и аналитика. Частая причина — новый файл с хешем опубликован, а HTML, CDN или service worker ещё ссылается на удалённый предыдущий chunk.\u003C\u002Fp>\n\u003Ctable>\u003Cthead>\u003Ctr>\u003Cth>Причина\u003C\u002Fth>\u003Cth>Признак\u003C\u002Fth>\u003Cth>Исправление\u003C\u002Fth>\u003C\u002Ftr>\u003C\u002Fthead>\u003Ctbody>\u003Ctr>\u003Ctd>Старый HTML в кэше\u003C\u002Ftd>\u003Ctd>Запрашивает прошлый hash\u003C\u002Ftd>\u003Ctd>Инвалидировать HTML вместе с релизом\u003C\u002Ftd>\u003C\u002Ftr>\u003Ctr>\u003Ctd>Неверный public path\u003C\u002Ftd>\u003Ctd>404 на вложенном URL\u003C\u002Ftd>\u003Ctd>Исправить путь в конфигурации сборки\u003C\u002Ftd>\u003C\u002Ftr>\u003Ctr>\u003Ctd>Рано удалённый chunk\u003C\u002Ftd>\u003Ctd>Ошибка после обновления вкладки\u003C\u002Ftd>\u003Ctd>Хранить несколько версий ассетов\u003C\u002Ftd>\u003C\u002Ftr>\u003Ctr>\u003Ctd>Виджет недоступен\u003C\u002Ftd>\u003Ctd>403\u002F5xx чужого домена\u003C\u002Ftd>\u003Ctd>Проверить необходимость и fallback\u003C\u002Ftd>\u003C\u002Ftr>\u003C\u002Ftbody>\u003C\u002Ftable>\n\u003Ch2>Проверка релиза\u003C\u002Fh2>\u003Cp>Откройте страницу в новом профиле браузера и посмотрите Network для CSS и JS. Сравните URL в HTML с manifest текущей сборки: так видно, какой компонент устарел. Проверяйте не только главную, но форму и вложенный маршрут — ошибки \u003Ccode>publicPath\u003C\u002Fcode> часто проявляются именно там.\u003C\u002Fp>\n\u003Cpre>\u003Ccode># Нормальный ответ для ассета\ncurl -I https:\u002F\u002Fexample.ru\u002F_nuxt\u002Fapp.abc123.js\n# HTTP\u002F2 200\n# content-type: application\u002Fjavascript\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>Не лечите проблему минификацией или отключением кэша навсегда. Для файлов с хешем допустим долгий cache-control, а HTML должен получать новую ссылку на них при релизе. Service worker обновляйте отдельно: старый worker способен отдавать уже несуществующий shell приложения. Размер ресурсов покажет \u003Ca href=\"\u002Ftools\u002Fpage-size\">Page size\u003C\u002Fa>, а доступность страницы — \u003Ca href=\"\u002Fcheck\u002Ffree\">бесплатная проверка\u003C\u002Fa>.\u003C\u002Fp>\n\u003Csection class=\"blog-faq\">\u003Ch2>Вопросы и ответы\u003C\u002Fh2>\u003Cdetails>\u003Csummary>304 означает, что CSS или JS сломан?\u003C\u002Fsummary>\u003Cp>Нет, 304 означает, что браузер использует валидную кэшированную копию после проверки свежести. Проблема появляется, когда HTML просит файл, которого сервер или CDN уже не знает. Смотрите связку URL, статуса и версии релиза, а не один код ответа.\u003C\u002Fp>\u003C\u002Fdetails>\u003Cdetails>\u003Csummary>Нужно ли отключить кэш для всех ассетов?\u003C\u002Fsummary>\u003Cp>Нет, это сделает повторные посещения медленнее и не устранит рассинхронизацию версий. Для хешированных файлов полезен долгий кэш, а HTML должен быстро обновляться. Продуманное правило кэша надёжнее, чем постоянная инвалидация всего сайта.\u003C\u002Fp>\u003C\u002Fdetails>\u003Cdetails>\u003Csummary>Почему ошибка видна только после обновления страницы?\u003C\u002Fsummary>\u003Cp>Открытая вкладка могла сохранить старый runtime, который пытается догрузить прежний chunk после нового релиза. Храните старые ассеты некоторое время и обрабатывайте ошибку загрузки чанка. Это мягче, чем заставлять пользователя увидеть пустой экран.\u003C\u002Fp>\u003C\u002Fdetails>\u003Cdetails>\u003Csummary>Достаточно ли проверить главную после деплоя?\u003C\u002Fsummary>\u003Cp>Нет, главная часто использует меньше кода, чем каталог, форма или кабинет. Выберите несколько критичных пользовательских сценариев и вложенный маршрут. Такой smoke тест быстрее выявляет неверный путь, отсутствующий chunk и ошибку стороннего виджета.\u003C\u002Fp>\u003C\u002Fdetails>\u003C\u002Fsection>",0,[12,15,19,23,26],{"slug":13,"title":14,"date":7,"views":10},"bitye-izobrazheniya","Битые изображения на сайте",{"slug":16,"title":17,"date":18,"views":10},"bitye-ssylki-kak-najti-i-ispravit","Битые ссылки: как найти и исправить","2026-08-15",{"slug":20,"title":21,"date":22,"views":10},"robot-view-glazami-robota","Сайт глазами робота","2026-08-09",{"slug":24,"title":25,"date":7,"views":10},"html-struktura-dokumenta","HTML-структура документа",{"slug":27,"title":28,"date":22,"views":10},"gzip-i-keshirovanie","Gzip и Brotli: сжатие HTML, CSS и JS",1789381424986]