Инструменты разработчика Google Chrome работают очень медленно

81

Поскольку Google Chrome обновился до версии 50.x, работа с DevTools стала невозможной. Эта проблема воспроизводится в основном на вкладке «Сеть». Каждый раз при нажатии на «запрос» проходит около 30-40 секунд. после этого хром может вылететь. Пытался удалить все расширения, очистить кеш и переустановить, но не помогло. Кто-нибудь знает, как исправить эту проблему?

Я использую Chrome 50.0.2661.87 м

UPD: Проблема может возникнуть из-за длинных заголовков. Попробуйте закрыть заголовки ответа и запроса.

Киррош
источник
Когда вы говорите «щелкнуть по запросу», вы имеете в виду щелчок по любому запросу или определенной части пользовательского интерфейса, помеченной как «запрос»? Можете ли вы дать ссылку на пример веб-сайта, на котором у вас возникла проблема? Я пытался воспроизвести на сайте StackOverflow, но не столкнулся с проблемами.
Matt Zeunert
@MattZeunert Вероятно, вы можете найти его на любом сайте, но попробуйте это en.wikipedia.org/wiki/Main_Page или на сайте с большим количеством скриптов и XMLHttpRequests. Откройте инструменты разработчика -> Сеть -> щелкните какой-либо запрос или скрипт в списке -> перейдите к заголовкам / предварительному просмотру. Навигация занимает слишком много времени (по крайней мере, для меня) - 30 секунд
Киррош
Эта проблема стала возникать и у меня вчера. Попробовали многие из тех же шагов в дополнение к переименованию профиля «По умолчанию» на случай, если профиль был поврежден. Попробую сегодня вечером на другой машине дома.
NuNn DaDdY
Я использую OSX 50.0.2661.102, и у меня такая же проблема, когда я пытаюсь редактировать свойства CSS. Фактическое обновление значения занимает так много времени, и в большинстве случаев оно даже удаляет последние введенные мной символы. Действительно раздражает.
Йоанн
Работая над большим приложением Angular, действительно сложно переключаться между консолью и средством просмотра элементов. При выполнении каких-либо действий в консоли графический интерфейс становится очень медленным. При выборе элемента на экране обычно есть 2-секундная задержка.
skmasq

Ответы:

49

У меня были похожие проблемы с отладкой в ​​версиях Chrome 50+ на Mac OS X 10.11.3. Единственное решение, которое я нашел до сих пор, - это держать инструменты разработчика закрепленными вправо, и, похоже, они такие же производительные, как и раньше. Не оптимальное решение, но в моем случае работает.

Крис Киттредж
источник
5
Совершенно странно, но однозначно спасает жизнь. Мне нравится думать, что этот обходной путь не понадобится слишком долго, но он снова сделал инструменты разработчика пригодными для меня. Благодаря!
jpcamara
3
Даже отстыкованные инструменты с шириной экрана имеют ту же проблему, о которой сообщалось. В суженном виде действует нормально. Это определенно странно :) Это где-то сообщается? Изменить: он основан на ширине исходного окна! Чем уже, тем быстрее он реагирует. Спасибо @Chris!
Михал Рохарик,
1
Кажется, снова вернулся в 60.0.3112.113. Это исправление снова работает.
SoEzPz
1
Просто столкнулся с этой проблемой с Chrome 61.0.3163.100. Опять же, более тонкое окно полностью исправило это!
stevejboyer
2
@Rebar Если вы еще не исправили это, есть еще одно исправление, которое было найдено несколько недель назад по ссылке
Ophidian
19

Наконец, было найдено решение, которое помогло мне после такого долгого времени и после стольких неудачных попыток исправить это: Решение на форумах Google Chrome

Перейдите в chrome: // flags / # force-color-profile

Измените его на sRGB

Поскольку Google не разрешает прямые ссылки на них, chrome://вам придется самостоятельно вставлять двоеточие или вводить всю ссылку вручную на панели инструментов.

Офидиан
источник
14

Моя ситуация была аналогичной: после некоторой борьбы с крайне медленным откликом инструментов разработчика я обнаружил, что проблема была вызвана расширением Chrome, которое я установил для knockoutJs. Поэтому для людей, испытывающих эти проблемы, в рамках первоначального устранения неполадок попробуйте отключить расширения Chrome .

Diegosasw
источник
2
Хороший. Для меня это было Knockoutjs context debuggerпродолжением. Ура!
Dunc
2
Для меня это было React Developer Tools! Это происходит только на Mac, а не на Windows.
Доми
Отключение Auguryрасширения мне помогло. Благодаря!
Матти Лехтинен
1
Могу подтвердить, что это также React Developer Toolsвлияет на окна
user5480949
7

Я использую версию 61.0.3163.79, и у меня та же проблема, о которой говорится в этом посте.

Путем поисков я обнаружил, что проблема была в пользователе, которого я использовал. Я попытался ввести int google chrome в качестве гостя, и инструменты разработчика снова стали быстрее.

Итак, я сделал следующее:

  1. Проверьте, выполняется ли отладка с использованием гостевого пользователя быстрее, чем должна быть.
  2. Выйти из учетной записи .
  3. Очистите весь кеш, связанный с Google Chrome.
  4. Перезагрузите компьютер (но я думаю, что достаточно закрыть браузер)
  5. Войдите снова в свой аккаунт .

Надеюсь, это поможет другим людям с той же проблемой.

[РЕДАКТИРОВАТЬ:]

Я обнаружил, что через некоторое время (недели) инструменты разработчика Google Chrome снова станут медленнее. Итак, я попробовал следующее решение, и оно сработало:

  1. Открыть dev tools
  2. Переходим во Sourcesвкладку.введите описание изображения здесь
  3. Очищены все наблюдаемые переменные, точки останова, точка останова DOM и точка останова прослушивателей событий. введите описание изображения здесь

[ВТОРОЙ РЕДАКТИРОВАНИЕ:]

Через несколько недель проблема возникла снова. Я установил канарейку Google Canary версии 64.0.3249.2 (64-разрядную), и мои проблемы исчезли.

Для тех, кто не знает, что такое канарейка, перейдите по этой ссылке.

Рикардо Роша
источник
4

Google знает о проблеме - https://bugs.chromium.org/p/chromium/issues/detail?id=624097

Проблема, кажется, исчезла в версии 53 - сейчас они пытаются выяснить, что ее решило. Если возможно, исправление будет снова объединено с версией 52. Но по крайней мере они над этим работают.

Джимми Томсен
источник
3
Сейчас я работаю над версией 53.0.2785.101, проблема все еще не решена. Это настолько непригодно для использования, что я установил firefox, и я не использовал его много лет ...
MatteoSp
Практически то же самое и здесь - хотел отредактировать текст в div, чтобы показать клиенту, потребовалось 30 секунд после того, как я щелкнул, чтобы перейти к редактируемому тексту.
LocalPCGuy
Я использовал v53, когда нашел эту ветку. Так это кажется неправильным? Однако 53.0.2785.143 м кажется лучше. Хотя не уверен, что все решила перезагрузка.
Ян Грейнджер
9
Та же проблема в Chrome 54.0.2840.71 м (64-бит)
Lelis718,
Любой обходной путь? Я попробовал канарейку, и у меня то же самое. Мне нужно сейчас перейти на firefox ...
Николас Тери
3

Если другие прибудут сюда, столкнувшись с той же проблемой, что и я, попробуйте изменить вкладку инструментов разработчика, на которую вы смотрите, на Elements .

У меня была открыта вкладка «Источники», и Chrome пытался загрузить огромные ресурсы для этой вкладки, что создавало многосекундную задержку между console.log()созданными мной событиями и отображением этих зарегистрированных сообщений.

Duhaime
источник
3

Снова сделайте devtools быстрым, отключив все точки останова:

Перейдите на Sourcesвкладку, покажите отладчик (может быть скрыт) и нажмите Deactivate breakpoints.

(Chrome v62.0 в Windows 10)

Hinrich
источник
это оно! Пробовал все в этой теме, но это, наконец, сработало. Я думаю, что для больших проектов js это как-то вызывает проблемы.
coderofsalvation
2

У меня была такая же проблема с 54.0.2840.99 м версией Google Chrome.

Но переход на Chrome Canary сработал!

КредитJ4490
источник
1
Google Canary работал у меня до последнего обновления, и версия 59.0.3054.1 тоже очень медленная :(
miyconst
1

Я тоже сталкиваюсь с той же проблемой.

Я попробовал отключить скринкаст без флажка. Теперь все работает нормально.

Хуршид Ансари
источник
1
На случай, если кто-то еще изо всех сил пытается найти «переключить скринкаст»: это значок в верхнем левом углу DevTools
Матти Лехтинен
1

Уменьшить размер resourceсуществаoverridden

У overridingменя хорошо работали только файлы с меньшим количеством строк кода. Я приземлился здесь, потому что я был overridingфайлом, в котором были 35,000 +строки Javascript.

Кроме того, если ваш resourceновый один - т.е. он не включен в scriptтег или linkтег, вы можете override main html documentдобавить тег: <script src="/my-new-script.js"></script>. Добавить файл в домен корня в пределах Overrides folderВКЛ Chrome:

overriding HTML

введите описание изображения здесь

затем overridingПОЛЬЗОВАТЕЛЬСКИЙ СКРИПТ:

введите описание изображения здесь

Удачи...

Аакаш
источник
1

Я снова ускорил Chrome, выполнив следующие действия:

  • Откройте DevTools -> выберите вкладку Elements ->
    • выберите вложенную вкладку « Вычисленные » -> в разделе « Фильтр» убедитесь, что флажок « Показать все» не установлен.
    • выберите вкладку вложенных прослушивателей событий -> убедитесь, что прослушиватели Ancestors и Framework не выбраны.
Абдул
источник
0

В моем случае у меня была настройка локальных переопределений ( https://developers.google.com/web/updates/2018/01/devtools#overrides ) в папке «Загрузки», в которой было много файлов, что замедляло работу инструментов разработчика.

Настройка переопределений в собственном отдельном каталоге устранила медлительность.

Свар Шах
источник
0

Для меня, когда я использую Chrome версии 81.0.4044.138 (официальная сборка) (64-разрядная версия) на Ubuntu 18, проблема, похоже, связана с мобильным представлением. Когда я отключаю мобильный просмотр, проверка снова становится очень быстрой. Я думаю, это вызвано эмуляцией сенсорного экрана и прочими мобильными штуками.

Мобильная версия в Инструментах разработчика Chrome

Чтобы получить что-то похожее на мобильное представление, я перемещаю док DevTools в сторону и изменяю его размер, пока не получу нужную мне ширину. Это не идеально, но большую часть времени полезно.

Помимо Chrome, Firefox намного быстрее проверяет сайты в целом, хотя я не использовал FF, потому что привык к определенным вещам в Chrome. Более того, большинство сайтов, с которыми я работаю, не вызывают этих проблем в Chrome, фактически, это происходит только с одним сайтом.

PD : сайт, который вызывает проблему в Chrome Dev Tools, имеет множество переменных CSS. Не уверен, связано ли это.

ОБНОВЛЕНИЕ 1 НЕДЕЛЮ назад Я смог без проблем использовать Chrome даже в мобильной версии, отключив опцию «Показывать медиа-запросы».

введите описание изображения здесь

Бето Авейга
источник