Startzeit der Entwicklertools verkürzen

Maksim Sadym
Maksim Sadym
X GitHub

Das Starten der DevTools ist jetzt etwa 13% schneller 🎉 (von 11,2 Sekunden auf 10 Sekunden)

Zusammenfassung: Das Ergebnis wird durch Entfernen einer redundanten Serialization erzielt.

Übersicht

Beim Starten von DevTools müssen einige Aufrufe an die V8-JavaScript-Engine erfolgen.

Startvorgang der Entwicklertools

Der Mechanismus, mit dem Chromium DevTools-Befehle an V8 sendet (und für die IPC im Allgemeinen), wird mojo genannt. Meine Teamkollegen Benedikt Meurer und Sigurd Schneider haben bei der Arbeit an einer anderen Aufgabe eine Ineffizienz entdeckt und eine Idee zur Verbesserung des Prozesses entwickelt, indem zwei redundante Schritte beim Senden und Empfangen dieser Nachrichten entfernt wurden.

Sehen wir uns an, wie der mojo-Mechanismus funktioniert.

Die mojo-Mechanismen

Die Mojo-Mechanismen

Es gibt einen Mojo-Befehl EvaluateScript, mit dem der JS-Befehl ausgeführt wird. Er serialisiert den gesamten JS-Befehl einschließlich der arguments in einen JavaScript-Quellcode-String, der eval() sein kann. Wie Sie sich vorstellen können, können diese Strings ziemlich lang und teuer werden. Nachdem der Befehl von V8 empfangen wurde, werden diese JavaScript-Code-Strings vor der Ausführung deserialisiert. Dieser Prozess der Serialisierung und Deserialisierung für jede einzelne Nachricht verursacht erheblichen Overhead.

Benedikt Meurer erkannte, dass die Serialisierung und Deserialisierung der arguments recht aufwendig ist und dass die gesamten Schritte „JS-Befehl in JS-String serialisieren“ und „JS-String deserialisieren“ redundant sind und übersprungen werden können.

Technische Details: RenderFrameHostImpl::ExecuteJavaScript

Verbesserungen

Verbesserte Mechanismen

Wir haben eine weitere Mojo API-Methode eingeführt, mit der wir den Objektnamen, die aufzurufende Methode und die Liste der Argumente direkt übergeben können, anstatt den JavaScript-Quellcode-String erstellen zu müssen. So können wir die Serialisierung und Deserialisierung überspringen und müssen den JavaScript-Code nicht mehr parsen.

Technische Details zur Implementierung dieser Optimierung finden Sie in den folgenden zwei Patches:

  1. CL 2431864: [devtools] Performance-Overhead der Nachrichtenübermittlung im Front-End reduzieren
  2. CL 2442012: [devtools] ExecuteJavaScriptMethod in den Entwicklertools verwenden

Auswirkungen

Um die Wirksamkeit der Änderung zu messen, haben wir einige Messungen durchgeführt, bei denen wir die Chromium-Versionen cb971089a058 und 4f213b39d581 (vor und nach der Änderung) verglichen haben.

Für beide Versionen haben wir das folgende Szenario fünfmal ausgeführt:

  1. Trace mit chrome://tracing aufzeichnen
  2. DevTools in DevTools öffnen
  3. Rufen Sie den aufgezeichneten CrRendererMain-Trace ab und vergleichen Sie die V8-spezifischen Messwerte.

Basierend auf diesen Tests wird DevTools mit der Optimierung ungefähr 13% schneller geöffnet (von 11, 2 Sekunden auf 10 Sekunden).

Highlights, CPU-Dauer

Methodenname Nicht optimiert (ms) Optimiert (ms) Unterschiede (ms) Geschwindigkeitsverbesserung (%)
Summe 11.213,19 9.953,99 −1.259,20 12,65%
v8.run 499,67 3,61 -496,06 12,65%
V8.Execute 1.654,87 1.349,61 -305,25 3,07%
v8.callFunction 1.171,84 1.339,77 167.94 -1,69%
v8.compile 133,93 3.56 -130,37 1,31%

CPU-Zeit für das Laden der Entwicklertools (ms)

Vollständige Tabelle zum Vergleich von Messwerten für die Aufrufabfolge

Dadurch werden die DevTools schneller geöffnet und funktionieren mit weniger CPU-Auslastung. 🎉

Vorschaukanäle herunterladen

Verwenden Sie als Standard-Entwicklungsbrowser Chrome Canary, Chrome Dev oder Chrome Beta. Diese Vorabversionen bieten Zugriff auf die neuesten DevTools-Funktionen, ermöglichen den Test moderner Webplattform-APIs und helfen Ihnen, Probleme auf Ihrer Website zu finden, bevor Ihre Nutzer sie bemerken.

Chrome-Entwicklertools-Team kontaktieren

Mit den folgenden Optionen können Sie über neue Funktionen, Updates oder andere Themen im Zusammenhang mit den DevTools sprechen.