Narzędzia programistyczne Google Chrome działają bardzo wolno

81

Sinсe Google Chrome został zaktualizowany do wersji 50.x, praca z DevTools stała się niemożliwa. Ten numer powielono głównie w zakładce „Sieć”. Za każdym razem, gdy klikniesz na „żądanie”, zajmuje to około 30-40 sekund. po tym chrome może się zawiesić. Próbowałem usunąć wszystkie rozszerzenia, wyczyścić pamięć podręczną i ponownie zainstalować, ale nie pomogło. Czy ktoś wie, jak rozwiązać ten problem?

Używam Chrome 50.0.2661.87 m

UPD: Problem może być spowodowany długimi nagłówkami. Spróbuj zamknąć odpowiedź i zażądać nagłówków.

Kirrosh
źródło
Mówiąc o „żądaniu”, masz na myśli kliknięcie dowolnego żądania lub określonej części interfejsu użytkownika oznaczonej „żądanie”? Czy możesz podać link do przykładowej witryny internetowej, na której masz problem? Próbowałem odtworzyć w witrynie StackOverflow, ale nie napotkałem problemów.
Matt Zeunert
@MattZeunert Prawdopodobnie możesz go znaleźć na dowolnej stronie, ale wypróbuj tę en.wikipedia.org/wiki/Main_Page lub witrynę z wieloma skryptami i żądaniami XMLHttpRequests. Otwórz devtools -> Network -> kliknij na jakieś żądanie lub skrypt na liście -> przejdź do nagłówków / podglądu. Nawigacja zajmuje zbyt dużo czasu (przynajmniej dla mnie) - 30 sekund
Kirrosh
Ten problem zaczął mi się również pojawiać wczoraj. Oprócz zmiany nazwy profilu „Domyślny” próbowałem wykonać wiele tych samych czynności, na wypadek gdyby był on uszkodzony. Spróbuję dziś wieczorem w domu na innej maszynie.
NuNn DaDdY
Jestem na 50.0.2661.102 OSX i mam ten sam problem, gdy próbuję edytować właściwości CSS. Faktyczna aktualizacja wartości zajmuje dużo czasu, a przez większość czasu usuwa nawet najnowsze znaki, które wpisałem. Naprawdę irytujące.
Yoann
Pracując nad dużą aplikacją Angular, przełączanie się między konsolą a przeglądarką elementów jest naprawdę uciążliwe. Podczas wykonywania jakiejkolwiek czynności w konsoli GUI działa bardzo wolno. Podczas wybierania elementu na ekranie występuje zwykle 2-sekundowe opóźnienie.
skmasq

Odpowiedzi:

49

Mam podobne problemy z debugowaniem w Chrome w wersjach 50+ w systemie Mac OS X 10.11.3. Jedynym rozwiązaniem, które do tej pory znalazłem, jest zadokowanie narzędzi deweloperskich po prawej stronie i wydaje się, że jest tak samo wydajne jak wcześniej. Nie jest to optymalne rozwiązanie, ale w moim przypadku działa.

Chris Kittredge
źródło
5
Całkowicie dziwaczne, ale zdecydowanie ratujące życie. Lubię myśleć, że to obejście nie będzie konieczne zbyt długo, ale dzięki temu narzędzia deweloperskie znów będą dla mnie użyteczne. Dzięki!
jpcamara
3
Nawet niezadokowane narzędzia o szerokości ekranu mają ten sam problem, co zgłoszono. Po zwężeniu działa normalnie. To na pewno dziwne :) czy to gdzieś zostało zgłoszone? Edycja: jest oparta na szerokości okna źródłowego! Im węższy, tym szybciej reaguje. Dzięki @Chris!
Michał Roharik
1
Wydaje się, że wróciłem w 60.0.3112.113. Ta poprawka znowu działa.
SoEzPz
1
Właśnie napotkałem ten problem w przeglądarce Chrome 61.0.3163.100. Ponownie, chudsze okno całkowicie to naprawiło!
stevejboyer
2
@Rebar Jeśli jeszcze tego nie naprawiłeś, istnieje kolejna poprawka, która została znaleziona kilka tygodni temu link
Ophidian
19

W końcu znalazłem rozwiązanie, które pomogło mi po tak długim czasie i po tylu nieudanych próbach jego naprawy: Rozwiązanie na forach Google Chrome

Wejdź na chrome: // flags / # force-color-profile

Zmień to na sRGB

Ponieważ Google nie zezwala na bezpośrednie linki do chrome://, musisz samodzielnie wstawić dwukropek lub wprowadzić cały link ręcznie na pasku narzędzi.

Ofidian
źródło
14

Moja sytuacja była podobna, po pewnym czasie zmagań z ekstremalnie powolną reakcją narzędzi programistycznych odkryłem, że problem jest spowodowany przez rozszerzenie Chrome, które zainstalowałem dla knockoutJs. Dlatego w przypadku osób, u których występują te problemy, w ramach wstępnego rozwiązywania problemów spróbuj wyłączyć rozszerzenia Chrome .

diegosasw
źródło
2
Niezłe. Dla mnie to było Knockoutjs context debuggerrozszerzenie. Twoje zdrowie!
Dunc
2
Dla mnie to był React Developer Tools! Dzieje się tylko na Macu, nie dzieje się na Windowsie.
Domi
AuguryPomogło mi wyłączenie rozszerzenia. Dzięki!
Matti Lehtinen
1
Potwierdzam, że React Developer Toolsdotyczy to również systemu Windows
użytkownik5480949
7

Używam wersji 61.0.3163.79 i mam ten sam problem, o którym mówi ten post.

Podczas niektórych wyszukiwań okazało się, że problem dotyczył użytkownika, którego używałem. Próbowałem wejść do Google Chrome jako gość i devtools znów stały się szybsze.

Więc co zrobiłem to:

  1. Sprawdź, czy debugowanie przy użyciu użytkownika-gościa jest szybsze, jak powinno.
  2. Wyloguj się z konta .
  3. Wyczyść całą pamięć podręczną powiązaną z Google Chrome.
  4. Uruchom ponownie komputer (ale myślę, że wystarczy zamknąć przeglądarkę)
  5. Zaloguj się ponownie na swoje konto .

Mam nadzieję, że mogłoby to pomóc innym ludziom z tym samym problemem.

[EDYTOWAĆ:]

Dowiedziałem się, że po jakimś czasie (tygodniach) narzędzia deweloperskie w Google Chrome znów będą działać wolniej. Wypróbowałem więc następujące rozwiązanie i zadziałało:

  1. Otworzyć dev tools
  2. Przejdź do Sourceszakładki.wprowadź opis obrazu tutaj
  3. Wyczyszczono wszystkie obserwowane zmienne, punkty przerwania, punkt przerwania DOM i punkt przerwania nasłuchiwania zdarzeń. wprowadź opis obrazu tutaj

[DRUGA EDYCJA:]

Po kilku tygodniach problem powrócił. To, co zrobiłem, to zainstalowanie kanarka google w wersji 64.0.3249.2 (64-bit) i moje problemy zniknęły.

Kto nie wie, co to jest kanarek, sprawdź ten link.

Ricardo Rocha
źródło
4

Google zdaje sobie sprawę z problemu - https://bugs.chromium.org/p/chromium/issues/detail?id=624097

Wydaje się, że problem zniknął w wersji 53 - obecnie próbują dowiedzieć się, co go naprawiło. Jeśli to możliwe, poprawka zostanie przywrócona do wersji 52. Ale przynajmniej nad tym pracują.

Jimmy Thomsen
źródło
3
Pracuję teraz nad wersją 53.0.2785.101, nadal mam problem. Jest tak bezużyteczny, że zainstalowałem firefoxa i nie
używałem
Prawie to samo - chciałem edytować tekst w div, aby pokazać klientowi, zajęło 30 sekund po kliknięciu, aby zmienić tekst na edytowalny.
LocalPCGuy,
Używałem V53, kiedy znalazłem ten wątek. Więc to wydaje się nieprawidłowe? Jednak 53,0,2785,143 m wydaje się lepsze. Chociaż nie jestem pewien, czy to tylko ponowne uruchomienie go rozwiązało.
Ian Grainger
9
Ten sam problem w przeglądarce Chrome 54.0.2840.71 m (wersja 64-bitowa)
Lelis718
Jakieś obejście? Próbowałem kanarka i u mnie to samo. Muszę na razie przejść na Firefoxa ...
Nicolas Thery
3

Na wypadek, gdyby inni przyjechali tutaj z tym samym problemem, co ja, spróbuj zmienić kartę narzędzi deweloperskich, na którą patrzysz, na elementy .

Miałem otwartą kartę „Źródła” i Chrome próbował załadować ogromne zasoby dla tej karty, co spowodowało wielosekundowe opóźnienie między utworzonymi console.log()zdarzeniami a wyświetlaniem tych zarejestrowanych wiadomości.

duhaime
źródło
3

Spraw, by Devtools znów były zgrabne, dezaktywując wszystkie punkty przerwania:

Przejdź do Sourceszakładki, pokaż debugger (może być ukryty) i naciśnijDeactivate breakpoints .

(Chrome v62.0 w systemie Windows 10)

Hinrich
źródło
Otóż ​​to! Próbowałem wszystkiego w tym wątku, ale to w końcu zadziałało. Wydaje mi się, że w przypadku dużych projektów js wydaje się to powodować problemy.
coderofsalvation
2

Miałem ten sam problem z czasem w 54.0.2840.99 m wersji Google Chrome.

Ale przejście na Chrome Canary zadziałało!

PożyczkaJ4490
źródło
1
Google Canary działało dla mnie do ostatniej aktualizacji, a wersja 59.0.3054.1 jest również bardzo wolna :(
miyconst
1

Ja też mam ten sam problem.

Próbowałem bez zaznaczenia przełączać screencast. Teraz działa dobrze.

Khurshid Ansari
źródło
1
Na wypadek, gdyby ktoś inny również miał problem ze znalezieniem „przełączania screencast”: to ikona w lewym górnym rogu DevTools
Matti Lehtinen,
1

Zmniejsz rozmiar resourcebytuoverridden

Tylko overridingpliki z mniejszą liczbą wierszy kodu działały dobrze dla mnie. Wylądowałem tutaj, ponieważ byłem overridingplikiem z 35,000 +liniami Javascript.

Ponadto, jeśli Twój resourcejest nowy - tj. Nie jest uwzględniony wscript tagu lub linktagu można override main html documentdodać tag: <script src="/my-new-script.js"></script>. Dodaj plik do katalogu głównego domeny w ramach Overrides folderonChrome :

overriding HTML

wprowadź opis obrazu tutaj

następnie overridingSKRYPT NIESTANDARDOWY:

wprowadź opis obrazu tutaj

Powodzenia...

Aakash
źródło
1

Znowu przyspieszyłem Chrome, wykonując następujące czynności:

  • Otwórz DevTools -> wybierz Elements zakładkę ->
    • wybierz zagnieżdżoną kartę Obliczone -> w obszarze Filtr , upewnij się, że Pokaż wszystko opcja jest zaznaczona.
    • wybierz zagnieżdżoną zakładkę Event Listeners -> upewnij się, że Ancestors i Framework odbiorniki nie są zaznaczone.
Abdull
źródło
0

U mnie, pracując z Chrome w wersji 81.0.4044.138 (oficjalna kompilacja) (64-bitowa) na Ubuntu 18, problemem wydaje się być widok mobilny. Kiedy wyłączam widok mobilny, inspekcja znów staje się naprawdę szybka. Myślę, że jest to spowodowane emulacją dotyku i innymi urządzeniami mobilnymi.

Widok mobilny w Chrome Developer Tools

Aby uzyskać coś podobnego do widoku mobilnego, przesuwam doku DevTools na bok i zmieniam jego rozmiar, aż uzyskam potrzebną szerokość. Nie jest doskonały, ale jest przydatny przez większość czasu.

Poza Chrome, Firefox jest znacznie szybszy podczas ogólnej inspekcji witryn, chociaż nie używałem FF, ponieważ jestem przyzwyczajony do określonych rzeczy w Chrome. Co więcej, większość witryn, z którymi współpracuję, nie powoduje tych problemów w przeglądarce Chrome, w rzeczywistości dzieje się tak tylko z jedną witryną.

PD : witryna, która powoduje problem w Chrome Dev Tools, zawiera wiele zmiennych CSS. Nie jestem pewien, czy to jest powiązane.

AKTUALIZUJ 1 TYDZIEŃ temu Mogłem bez problemów korzystać z Chrome, nawet w widoku mobilnym, wyłączając opcję „Pokaż zapytania o media”

wprowadź opis obrazu tutaj

Beto Aveiga
źródło