Просмотр данных кеша с помощью Chrome DevTools

Это завершение Chrome Dev Summit 2020 ! Смотрите все сеансы на goo.gle/cds20-sessions прямо сейчас!

В этом руководстве показано, как использовать Chrome DevTools для проверки данных кэша.

Если вы пытаетесь проверить данные кеша HTTP, это не то руководство, которое вам нужно. Столбец «Размер в Сетевом журнале содержит информацию, которую вы ищете. См. Журнал сетевой активности.

Просмотр данных кеша

  1. Щелкните вкладку Приложение , чтобы откройте панель Приложение . Панель Manifest обычно открывается по умолчанию.

  2. Разверните раздел Cache Storage , чтобы просмотреть доступные кеши.

  3. Щелкните кеш, чтобы просмотреть его содержимое.

  4. Щелкните ресурс, чтобы просмотреть его заголовки HTTP в разделе под таблица.

  5. Нажмите Preview , чтобы просмотреть содержание ресурса.

Обновить ресурс

  1. Просмотр данных кеша.
  2. Щелкните ресурс, который хотите обновить. DevTools выделяет его синим, чтобы указать, что он выбран.

  3. Нажмите Обновить .

Фильтр ресурсов

  1. Просмотр данных кеша.
  2. Используйте Текстовое поле «Фильтр по пути «, чтобы отфильтровать любые ресурсы, не соответствующие указанному вами пути.

Удалить ресурс

  1. Просмотр данных кеша.
  2. Щелкните ресурс, который вы хотите удалить. DevTools выделяет его синим, чтобы указать, что он выбран.

  3. Нажмите Удалить выбранное .

Удалить все данные кеша

  1. Открыть приложение > Очистить хранилище .
  2. Убедитесь, что установлен флажок Cache Storage .

  3. Нажмите Очистить данные сайта .

Отзыв

Была ли эта страница полезной?
Да
Что было лучше всего на этой странице?
Это помогло мне достичь цели (я) )
Благодарим вас за отзыв. Если у вас есть конкретные идеи по улучшению этой страницы, создайте проблему.
На нем была вся необходимая мне информация
Спасибо за отзыв. Если у вас есть конкретные идеи по улучшению этой страницы, создайте проблему.
У него была точная информация
Спасибо за отзыв. Если у вас есть конкретные идеи о том, как улучшить эту страницу, создайте проблему.
Было легко прочитать
Спасибо за отзыв. Если у вас есть конкретные идеи по улучшению этой страницы, создайте проблему.
Что-то еще
Спасибо за отзыв. Если у вас есть конкретные идеи о том, как показывать над этой страницей, пожалуйста, создайте проблему.
Нет
Что было хуже всего на этой странице?
Это не помогло мне достичь моей цели (целей)
Спасибо за отзыв. Если у вас есть конкретные идеи по улучшению этой страницы, создайте проблему.
Отсутствовала нужная мне информация
Спасибо за отзыв. Если у вас есть конкретные идеи по улучшению этой страницы, создайте проблему.
В нем была неточная информация
Спасибо за отзыв. Если у вас есть конкретные идеи по улучшению этой страницы, создайте проблему.
Было трудно читать
Спасибо за отзыв. Если у вас есть конкретные идеи по улучшению этой страницы, создайте проблему.
Что-то еще
Спасибо за отзыв. Если у вас есть конкретные идеи о том, как улучшить эту страницу, создайте проблему.

[{«type»: «thumb-down», «id»: «missingTheInformationINeed», «label»: «Отсутствует нужная мне информация»}, {«type»: «thumb-down», «id»: «tooComplicatedTooManySteps», «label»: «Слишком сложно/слишком много шагов»}, {«type»: «thumb-down», «id»: «outOfDate», «label»: «Out of date»}, {«type»: «thumb-down», «id»: «samplesCodeIssue», » label «:» Образцы/Проблема кода «}, {» type «:» thumb-down «,» id «:» otherDown «,» label «:» Other «}] [{ «type»: «thumb-up», «id»: «easyToUnderstand», «label»: «Легко понять»}, {«type»: «thumb-up», «id»: «resolMyProblem», «label «:» Моя проблема решена «}, {» type «:» thumb-up «,» id «:» otherUp «,» label «:» Other «}]

Оцените статью
techsly.ru
Добавить комментарий