Skracanie czasu uruchamiania Narzędzi deweloperskich

Maksim Sadym
Maksim Sadym
X GitHub

Uruchamianie Narzędzi deweloperskich jest teraz o około 13% szybsze 🎉 (z 11,2 s do 10 s).

TL;DR; Efekt ten osiągnięto dzięki usunięciu zbędącej serializacji.

Omówienie

Podczas uruchamiania DevTools musi wykonać kilka wywołań mechanizmu JavaScript V8.

Proces uruchamiania Narzędzi deweloperskich

Mechanizm, którego Chromium używa do wysyłania poleceń do DevTools do V8 (i ogółem do IPC), nazywa się mojo. Moi koledzy Benedikt Meurer i Sigurd Schneider odkryli nieefektywność podczas pracy nad innym zadaniem i wpadli na pomysł, jak usprawnić proces, usuwając 2 zbędne kroki w sposobie wysyłania i odbierania tych wiadomości.

Zobaczmy, jak działa mechanizm mojo.

Mechanizmy mojo

Mechanizmy mojo

Istnieje komenda mojo EvaluateScript, która uruchamia polecenie JS. Serializuje ona całe polecenie JS, w tym arguments, do ciągu kodu źródłowego JavaScript, który można eval(). Jak możesz sobie wyobrazić, te ciągi znaków mogą być dość długie i drogie. Gdy V8 otrzyma polecenie, te ciągi kodu JavaScript są deserializowane przed uruchomieniem. Proces serializacji i deserializacji w przypadku każdej wiadomości powoduje znaczne obciążenie.

Benedikt Meurer zdał sobie sprawę, że serializacja i deserializacja arguments jest dość kosztowna, a całe kroki „Serializuj polecenie JS na ciąg znaków JS” i „Deserializuj ciąg znaków JS” są zbędne i można je pominąć.

Informacje techniczne: RenderFrameHostImpl::ExecuteJavaScript

Jak poprawiliśmy

Ulepszone mechanizmy

Wprowadziliśmy kolejną metodę interfejsu Mojo API, która umożliwia nam przekazywanie nazwy obiektu, wywoływanej metody i listy argumentów bezpośrednio, zamiast tworzenia ciągu kodu źródłowego JavaScript. Dzięki temu możemy pominąć serializację i deserializację oraz uniknąć konieczności analizowania kodu JavaScript.

Szczegółowe informacje techniczne na temat implementacji tej optymalizacji znajdziesz w tych 2 poprawkach:

  1. CL 2431864: [devtools] Zmniejsz obciążenie wydajnościowe przesyłania wiadomości w interfejsie użytkownika
  2. CL 2442012: [devtools] Używanie ExecuteJavaScriptMethod w Narzędziach deweloperskich

Wpływ

Aby zmierzyć skuteczność tej zmiany, przeprowadziliśmy kilka pomiarów porównujących wersje Chromium cb971089a058 i 4f213b39d581 (przed i po zmianie).

W przypadku obu wersji przeprowadziliśmy 5 razy ten sam test:

  1. Rejestrowanie zrzutu za pomocą aplikacji chrome://tracing
  2. Otwieranie Narzędzi deweloperskich w Narzędziach deweloperskich
  3. Pobierz zarejestrowany CrRendererMain wykres i porównaj dane dotyczące V8.

Na podstawie tych eksperymentów stwierdziliśmy, że po optymalizacji narzędzia DevTools otwierają się o około 13% szybciej (z 11,2 s na 10 s).

Najważniejsze momenty, czas pracy procesora

Nazwa metody Nie zoptymalizowany (ms) Zoptymalizowana (ms) Różnice (ms) Przyspieszenie (w %)
Łącznie 11 213,19 9,953.99 -1259,20 12,65%
v8.run 499,67 3,61 -496,06 12,65%
V8.Execute 1654,87 1349,61 -305,25 3,07%
v8.callFunction 1171,84 1339,77 167,94 -1,69%
v8.compile 133,93 3,56 -130,37 1,31%

Czas wczytywania Narzędzi deweloperskich przez procesor (ms)

Tabela porównywania danych pełnego śledzenia

W rezultacie Narzędzia deweloperskie otwierają się i działają szybciej, zużywając mniej procesora. 🎉

Pobieranie kanałów podglądu

Rozważ użycie jako domyślnej przeglądarki deweloperskiej przeglądarki Chrome w wersji Canary, Dev lub Beta. Te kanały wersji wstępnej zapewniają dostęp do najnowszych funkcji DevTools, umożliwiają testowanie najnowocześniejszych interfejsów API platformy internetowej i pomagają znaleźć problemy w witrynie, zanim zrobią to użytkownicy.

Kontakt z zespołem Narzędzi deweloperskich w Chrome

Aby omówić nowe funkcje, aktualizacje lub inne kwestie związane z Narzędziami deweloperskimi, skorzystaj z tych opcji.