Memory Inspector: Inspect ArrayBuffer, TypedArray, DataView und Wasm Memory.

Jecelyn Yeen
Jecelyn Yeen
Sofia Emelianova
Sofia Emelianova

Mit dem neuen Arbeitsspeicher-Inspector können Sie den ArrayBuffer-, TypedArray- und DataView-Arbeitsspeicher in JavaScript sowie WebAssembly.Memory von in C++ geschriebenen Wasm-Anwendungen prüfen.

Memory Inspector öffnen

Es gibt mehrere Möglichkeiten, den Speicherinspektor zu öffnen.

Über das Menü öffnen

  1. Öffnen Sie die Entwicklertools.
  2. Klicken Sie auf Weitere Optionen Mehr > Weitere Tools > Arbeitsspeicher Inspector. Menü des Arbeitsspeicher-Inspectors

Während der Fehlerbehebung öffnen

  1. Öffnen Sie eine Seite mit dem JavaScript ArrayBuffer. Wir verwenden diese Demoseite.
  2. Öffnen Sie die Entwicklertools.
  3. Öffnen Sie die Datei demo-js.js im Bereich Quellen und setzen Sie einen Haltepunkt in Zeile 18.
  4. Aktualisieren Sie die Seite.
  5. Maximieren Sie den Abschnitt Umfang im rechten Bereich Debugger.
  6. Sie können das Arbeitsspeicherinspektor öffnen:

    • Über das Symbol: Klicken Sie auf das Symbol neben der Eigenschaft buffer oder
    • Über das Kontextmenü: Klicken Sie mit der rechten Maustaste auf die Eigenschaft buffer und wählen Sie Im Memory Inspector-Bereich anzeigen aus.

    Im Steuerfeld für den Memory Inspector anzeigen

Mehrere Objekte untersuchen

  1. Sie können auch DataView oder TypedArray untersuchen. Beispielsweise ist b2 ein TypedArray. Wenn Sie dies prüfen möchten, klicken Sie mit der rechten Maustaste auf die Eigenschaft b2 und wählen Sie Im Steuerfeld für den Memory Inspector anzeigen aus (noch kein Symbol für TypedArray oder DataView).
  2. Im Arbeitsspeicherinspektor wird ein neuer Tab geöffnet. Beachten Sie, dass Sie mehrere Objekte gleichzeitig untersuchen können. Neuer Tab im Speicherinspektor

Speicherinspektor

Speicherinspektor

Der Speicherinspektor besteht aus drei Hauptbereichen:

Navigationsleiste

  1. Unter Adresseingabe wird die aktuelle Byteadresse im Hexadezimalformat angezeigt. Sie können einen neuen Wert eingeben, um zu einer neuen Position im Speicherpuffer zu springen. Geben Sie beispielsweise 0x00000008 ein.
  2. Arbeitsspeicherzwischenspeicher können länger als eine Seite sein. Anstatt durch die Inhalte zu scrollen, können Sie sich auch mit den Links- und Rechts-Schaltflächen bewegen.
  3. Mit den Schaltflächen auf der linken Seite können Sie vor- und zurück navigieren.
  4. Standardmäßig wird der Puffer beim Stepping automatisch aktualisiert. Sollte dies nicht der Fall sein, können Sie mit der Schaltfläche Aktualisieren die Erinnerung und den Inhalt aktualisieren.

Arbeitsspeicherzwischenspeicher

Arbeitsspeicherzwischenspeicher

  1. Links wird die Adresse im Hexadezimalformat angezeigt.
  2. Der memory wird ebenfalls im Hexadezimalformat angezeigt, wobei jedes Byte durch ein Leerzeichen getrennt ist. Das aktuell ausgewählte Byte wird hervorgehoben. Sie können auf das Byte klicken oder mit der Tastatur (links, rechts, oben, unten) navigieren.
  3. Auf der rechten Seite ist eine ASCII-Darstellung des Speichers zu sehen. Eine Hervorhebung zeigt den entsprechenden Wert für die ausgewählten Bits im Byte an. Ähnlich wie beim Arbeitsspeicher können Sie auf das Byte klicken oder mit der Tastatur navigieren (links, rechts, oben, unten).

Wertprüftool

Wertprüftool

  1. In der oberen Symbolleiste befindet sich eine Schaltfläche, mit der du zwischen Big and Little Endian wechseln und die Einstellungen öffnen kannst. Öffnen Sie die Einstellungen, um die Werttypen auszuwählen, die standardmäßig im Prüftool angezeigt werden sollen. Symbolleistenschaltfläche
  2. Im Hauptbereich werden alle Interpretationen von Werten gemäß den Einstellungen angezeigt. Standardmäßig werden alle angezeigt.
  3. Die Codierung ist anklickbar. Sie können zwischen „dec“, „hex“, „oct“ für „Integer“ und „sci“ und „dec für Gleitkommazahlen“ wechseln. Codierungsschalter

Arbeitsspeicher prüfen

Untersuchen wir den Speicher gemeinsam.

  1. So starten Sie die Fehlerbehebung.
  2. Ändern Sie die Adresse unter Adresseingabe in 0x00000027. Adresseingabe
  3. Beachten Sie die ASCII-Darstellung und die Wertauswertung. Derzeit sind alle Werte leer.
  4. Neben Pointer 32-bit und Pointer 64-bit sehen Sie die blaue Schaltfläche Jump to address (Zu Adresse springen). Sie können darauf klicken, um die Adresse aufzurufen. Die Schaltflächen sind ausgegraut und können nicht angeklickt werden, wenn die Adressen ungültig sind. Schaltfläche „Zur Adresse springen“
  5. Klicken Sie auf Skriptausführung fortsetzen, um den Code durchzugehen. Skriptausführung fortsetzen
  6. Beachten Sie, dass die ASCII-Darstellung jetzt aktualisiert ist. Alle Interpretationen von Werten werden ebenfalls aktualisiert. Alle Interpretationen von Werten werden aktualisiert
  7. Lassen Sie uns das Wertprüftool so anpassen, dass nur eine Gleitkommazahl angezeigt wird. Klicken Sie auf die Schaltfläche Einstellungen und markieren Sie nur Float 32-Bit und Float 64-Bit. Einstellungen zum Anpassen des Wertprüftools
  8. Ändern wir die Codierung von dec in sci. Die Wertedarstellungen werden entsprechend aktualisiert. Ändern Sie die Codierung.
  9. Versuchen Sie, mit Ihrer Tastatur oder der Navigationsleiste im Arbeitsspeicherzwischenspeicher zu navigieren. Wiederholen Sie Schritt 4, um Änderungen der Werte zu beobachten.

WebAssembly-Arbeitsspeicherprüfung

Das WebAssembly.Memory-Objekt ist ein ArrayBuffer-Objekt, das die Rohbyte des Objektspeichers enthält. Im Steuerfeld Memory Inspector können Sie solche Objekte in Wasm-Anwendungen überprüfen, die in C++ geschrieben wurden.

So kannst du die WebAssembly.Memory-Prüfung in vollem Umfang nutzen:

  • Sie müssen Chrome 107 oder höher verwenden. Sie können Ihre Version unter chrome://version/ prüfen.
  • Installieren Sie die Erweiterung C/C++ DevTools Support (DWARF). Dies ist ein Plug-in für das Debugging von C/C++ WebAssembly-Anwendungen mithilfe von DWARF-Debugging-Informationen.

So prüfen Sie den WebAssembly.Memory eines Objekts:

  1. Öffnen Sie die Entwicklertools auf dieser Demoseite.
  2. Öffnen Sie im Bereich Quellen demo-cpp.cc und legen Sie einen Haltepunkt in der Funktion main() in Zeile 15 fest: x[i] = n - i - 1;.
  3. Aktualisieren Sie die Seite, um die Anwendung auszuführen. Der Debugger wird am Haltepunkt pausiert.
  4. Maximieren Sie im Bereich Debugger den Bereich Bereich > Lokal.
  5. Klicken Sie auf das Symbol Im Memory Inspector anzeigen. neben dem Array x: int[10].

    Alternativ können Sie mit der rechten Maustaste auf das Array klicken und Im Memory Inspector-Bereich anzeigen auswählen.

Das x-Array wurde in Memory Inspector geöffnet.

Wenn Sie den Objektspeicher nicht mehr hervorheben möchten, bewegen Sie den Mauszeiger im Bereich Memory Inspector auf das Objektlogo und klicken Sie auf die Schaltfläche x.

Objektspeicher nicht mehr hervorheben.

Weitere Informationen erhalten Sie unter: