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

Ответ 1

Это было решено путем очистки моего кеша (временные файлы, файлы cookie и т.д.) в Chrome. Не знаете, в чем была основная причина, но это устранило проблему.

Ответ 2

У меня была такая же проблема, я пробовал одни и те же решения без удачи, пока я не уволил procmon и не увидел, что Chrome действительно просматривает всю мою папку Projects (что составляет несколько сотен тысяч файлов).

Была ссылка на эту папку в разделе Рабочая область/Папки в приложении "Настройки разработчика". Удаление справки помогло решить проблему.

Ответ 3

У меня была та же проблема.

Моя проблема заключалась в том, что я использовал браузер для создания большого пакета (~ 92k строк) ширины SOURCEMAP. browserify app.js -d -o bundle.js.

Я решил его, разделив bundle.js.

Я экспортировал все node модули в отдельный файл (modules.js), добавив --require [module name]:

browserify -r react -r lodash -r three > build/modules.js

а затем создайте bundle.js без внешних модулей, добавив --external [module name].

browserify -t babelify -x react -x lodash -x three src/app.js > build/bundle.js

(-t babelify, потому что я использовал react/JSX в моем проекте.)

ПРИМЕЧАНИЕ. Вы должны включить module.js в свой html до bundle.js.

My bundle.js сжимается от ~ 92000 до ~ 26000 строк; -)

EDIT. Чтобы создать пакет без внешних модулей (node_modules), вы также можете использовать --no-bundle-external вместо [-x NODE_MODULE_NAME]*.

РЕДАКТИРОВАТЬ № 2. Когда вы используете модуль в своем проекте, который содержит много подмодулей, -r|-x [MAIN_MODULE_NAME] не потребует | исключить подмодули.

Пример с react-bootstrap:

react-bootstrap содержит много подмодулей, react-bootstrap/lib/[submodule].

browserify -r react-bootstrap > build/modules.js не потребуется, например, модуль Button (react-bootstrap/lib/Button). Так что...

... если вы используете

browserify --no-bundle-external src/app.js > build/bundle.js

... вы не сможете использовать Button в своем приложении, потому что --no-bundle-external исключает модули all node, включая подмодули. Поэтому не забудьте потребовать все необходимые подмодули:

browserify -r react-bootstrap -r react-bootstrap/lib/Button > build/modules.js

ПРИМЕЧАНИЕ. Кроме того, чтобы увеличить производительность, вы можете использовать exorcist, чтобы поместить исходную карту в отдельный файл. Установите его с помощью:

npm install --save-dev exorcist

и измените команду browserify:

browserify --no-bundle-external src/app.js | exorcist build/bundle.js.map > build/bundle.js

Благодаря smhg для подсказки с excorcist. И покажите его ответ для более подробной информации.

Ответ 4

Используя Chrome 46.x/47.x на Linux (RHEL 7), ни один из предлагаемых решений не работал у меня. Для работы необходимо было отключить параметр "Использовать аппаратное ускорение при наличии" в расширенных настройках браузера.

Я заметил в мониторе/списке процессов, что рендеринг Chrome занимал много процессорных ресурсов и, как описано выше, даже если положить контрольную точку или выполнить шаги в инструкциях отладчика, потребуется 10 + секунд!

Ответ 5

Я добавил его в качестве комментария к ответу marcel, но поскольку для меня это имело большое значение, я думаю, что стоит выделить его как отдельный ответ:

У меня была встроенная исходная карта JS в файле с общим размером около 2-3 МБ (без сжатия, во время разработки). Chrome был невыносимо медленным при загрузке страницы (при открытии инструментов разработчика). Примерно через 20 секунд, когда файл и исходная карта источника были проанализированы, все будет более или менее нормальным. Кроме того, это стало хуже с обновлением до Chrome 43 (на Ubuntu).

Как только я разместил исходную карту в отдельном файле, все стало нормальным. Замедление загрузки страницы пропало. Источники доступны мгновенно.

Поскольку я строю с browserify, exorcist был тем, что я использовал. Более конкретно: с watchify в параметре -o, как описано в этой проблеме.

Ответ 6

У меня возникла такая проблема; открытие окна отладчика было вялым (10-20 секунд), а также каждый раз, когда я перешагивал код, независимо от того, насколько он прост, я испытал длительную задержку (10-20 секунд).

Причиной для меня было то, что у меня были большие массивы (1000 записей, 10 с МБ данных). Отладчик предварительно отображает все данные в области видимости (включая все глобальные переменные, все зависание окна и все параметры для всех функций в стеке вызовов) для отображения в окне "Переменные области". Если это дерево данных велико, то на каждом этапе потребуется отладчик долгое время, чтобы пересчитать дерево проверки переменных.

Мне удалось решить проблему (a) перемещение большого массива в неглобальную область, чтобы не допустить его от окна, а затем (б) перенос остальной части моей программы в отдельную область. Например:

<script>
(function() {
  // large variable in stack scope, stepping in any
  // code called from here will be slow
  var hugeArray = [...];
  calculateHugeArray(hugeArray);
})();

(function() {
  // large variable now out of scope, so Chrome won't
  // try to display it in the "Scope Variables"
  // window. This makes debugging and stepping faster.
  doMoreThings();
})();
</script>

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

Ответ 7

Мое решение состояло в том, чтобы просто удалить пакет проектов, которые выполнялись локально на моем компьютере и были подключены к IIS. Просто удаленные папки/проекты я не использую много или больше. удалил 25 ГБ данных, и теперь моя панель инструментов dev работает как заклинание!

Ответ 8

Очистка кеша и всех данных конфиденциальности также решила мою проблему: -)

Ответ 9

Это исправлено в будущей версии: https://code.google.com/p/chromium/issues/detail?id=485052

Ответ 10

Мой файл с расширением, включая исходную карту, составляет около 5 МБ. Я пробовал все решения на этом посту и видел только незначительное улучшение. В конце концов я сдал и удалил и переустановил Chrome. Желаю, чтобы я сразу это сделал, моя загрузка исходной карты в отладчике продолжилась от 15 секунд до 3.