В какой вкладке DevTools можно посмотреть max-age

Что проверяют

Умеете ли вы проверять кэширование и куки руками, а не только знаете слово max-age. Хороший ответ сразу разводит два разных max-age: в заголовке Cache-Control и у куки. Следом обычно спрашивают, как понять, что ресурс действительно взят из кэша.

Как отвечать

Для HTTP-кэша в Chrome это вкладка Network:

• выбрать запрос, открыть Headers и найти в Response Headers заголовок Cache-Control, например public, max-age=31536000, immutable. Значение указано в секундах;
• рядом полезно смотреть ETag, Last-Modified, Expires (при наличии max-age он игнорируется), Age от CDN и s-maxage для общих кэшей;
• колонка Size покажет (memory cache) или (disk cache), если ресурс не ходил в сеть, а статус 304 значит, что браузер перепроверил ресурс и получил подтверждение без тела.

Для куки это вкладка Application, раздел Storage, пункт Cookies: у каждой куки есть колонка Expires / Max-Age, там же видны HttpOnly, Secure и SameSite. Куки отдельного запроса видны и в Network, на вкладке Cookies внутри запроса.

Упомяните ещё пару мест, где встречается max-age: Strict-Transport-Security (HSTS) и Access-Control-Max-Age, который задаёт, сколько кэшировать ответ на preflight-запрос CORS. В Firefox всё устроено так же, только куки лежат во вкладке Storage.

Где спотыкаются

Проверяют кэширование с включённой галочкой Disable cache в Network. Пока DevTools открыты, она отключает кэш, и тестировщик заводит баг, которого нет.

Смотрят не на тот заголовок. В Request Headers браузер тоже может отправить Cache-Control: max-age=0 при перезагрузке, но о политике сервера говорит только заголовок ответа.

Отвечают одним словом «Network» и не знают про куки. На уточнении «а где посмотреть, когда истечёт кука авторизации?» ответ разваливается, хотя это соседняя вкладка Application.