Die Entwicklertools bieten einen Bereich für KI-Unterstützung, in dem Sie sich mit einem KI-Agent unterhalten können, um Ihre Website besser zu verstehen und Probleme zu beheben.
Mit der KI‑Unterstützung können Sie Probleme mit Stilen, Netzwerk, Leistung und Quellen Ihrer Website beheben.
Wenn Sie effektiv mit Gemini im Bereich KI-Unterstützung chatten möchten, sollten Sie wissen, wie Sie den Bereich öffnen, Prompts eingeben und den Gesprächsverlauf steuern.
Bereich für KI-Unterstützung öffnen
Der Bereich KI-Unterstützung wird in der Seitenleiste geöffnet.
Klicken Sie auf die Schaltfläche KI-Unterstützung, die sich rechts in der Hauptsymbolleiste oben befindet, um das Feld zu öffnen.
Sie können das Steuerfeld auch direkt über die Steuerfelder Elemente, Netzwerk, Quellen oder Leistung öffnen. Klicken Sie dazu mit der rechten Maustaste auf ein Element oder eine Anfrage und wählen Sie KI fragen aus.
Über das Befehlsmenü
Wenn Sie Unterstützung durch KI über das Befehlsmenü öffnen möchten, geben Sie AI ein und führen Sie dann den Befehl Show AI assistance (Unterstützung durch KI anzeigen) aus, neben dem das Symbol Drawer (Schublade) angezeigt wird.
Über das Menü „Weitere Tools“
Alternativ können Sie rechts oben die Weitere Optionen > Weitere Tools > KI-Unterstützung auswählen.
Prompten
Wenn Sie eine neue Unterhaltung beginnen, bietet die KI-Unterstützung Beispielprompts, die Ihnen den Einstieg erleichtern.
Klicken Sie auf einen der Prompts, um das Prompt-Eingabefeld unten im Bereich vorab auszufüllen.
Alternativ können Sie auch einen eigenen Prompt oder eine eigene Frage in das Eingabefeld eingeben.
Um einen Prompt zu senden, drücken Sie entweder die Enter-Taste oder klicken Sie auf den Pfeil rechts neben dem Eingabefeld.
Im kostenlosen Chatfeld können Sie allgemeine Fragen stellen, z. B. „Wie verwende ich die Entwicklertools, um die Barrierefreiheit zu debuggen?“ oder „Welche Netzwerkanfragen sind langsam?“. Sie können auch Teile einer Datei kopieren, z. B. aus dem Bereich Quellen, und in den Chat einfügen, um zu fragen, was sie bewirken.
KI‑Unterstützung beim Stylen
Verwenden Sie das Steuerfeld KI‑Unterstützung für das Styling, um das Gesamtlayout einer Website und die Styles bestimmter Elemente zu verstehen und KI‑generierte Korrekturen für CSS‑Fehler zu erhalten.
KI-Unterstützung über den Bereich „Elemente“ öffnen
Wenn Sie KI-Unterstützung über den Bereich Elemente öffnen möchten, während Sie einen DOM-Knoten untersuchen, klicken Sie mit der rechten Maustaste auf den Knoten und wählen Sie die Option KI fragen aus.
Wenn Sie KI-Unterstützung auf diese Weise öffnen, ist das untersuchte DOM-Element bereits als Kontextelement für die Konversation ausgewählt.
Alternativ können Sie auf die schwebende Schaltfläche klicken, die an einen DOM-Knoten angehängt ist, auf den Sie den Mauszeiger bewegen.
Kontext der Unterhaltung
Chats mit KI-Unterstützung beziehen sich immer auf das aktuell untersuchte Element, also das letzte Element, das im DOM-Baum des Elementbereichs ausgewählt wurde. Unten links im Bereich wird auf dieses Element verwiesen.
Ändern Sie den Kontext mit der Elementauswahl neben dem aktuellen Element oder indem Sie ein Element im DOM-Baum des Bereichs „Elemente“ auswählen.
Wenn Sie den Kontext ausgewählt haben, können Sie einen Screenshot des Viewports aufnehmen und ihn in den Chat einfügen. Klicken Sie neben dem Chateingabefeld auf die Schaltfläche Screenshot erstellen.
Sie können Screenshots verwenden, um Ihren Prompts zusätzlichen visuellen Kontext zu geben, z. B. um zu prüfen, ob alle sichtbaren Schaltflächen den gleichen Abstand haben.
Das aktuell untersuchte Element ist zwar die Grundlage für die Konversation, die KI-Unterstützung hat jedoch Zugriff auf alle Web-APIs, um weitere Informationen von der untersuchten Seite zu erfassen. Dazu gehört das Abfragen anderer Elemente mit document.querySelector oder das Auswerten berechneter Stile.
KI‑Unterstützung für das Netzwerk
Im Bereich KI-Unterstützung für das Netzwerk können Sie die von Ihrer Website gesendeten Anfragen nachvollziehen.
KI-Unterstützung über den Netzwerkbereich öffnen
Wenn Sie KI-Unterstützung über den Netzwerkbereich öffnen möchten, klicken Sie mit der rechten Maustaste auf eine Anfrage und wählen Sie die Option KI fragen aus.
Wenn Sie KI-Unterstützung auf diese Weise öffnen, wird die ausgewählte Netzwerkanfrage als Kontext für die Konversation vorausgewählt.
Alternativ können Sie auf die schwebende Schaltfläche neben der Netzwerkanfrage klicken, auf die Sie den Mauszeiger bewegen.
Kontext der Unterhaltung
Chats mit KI-Unterstützung beziehen sich auf die Netzwerkanfrage, die derzeit in der Anfrageliste des Netzwerk-Panels ausgewählt ist. Unten links im Bereich wird ein Verweis auf diese Anfrage angezeigt.
Sie können den Kontext ändern, indem Sie im Bereich Netzwerk auf eine andere Anfrage klicken.
KI-Unterstützung verwendet die Anfrage-URL, Header, Zeitangaben und die Kette des Anfragestarters, um Ihre Fragen zu beantworten.
Wichtig: Header, die vertrauliche Informationen enthalten könnten, werden automatisch unkenntlich gemacht.
Klicken Sie nach dem Starten einer Unterhaltung auf dem Chip Analyzing network data auf die Schaltfläche Erweitern, um die Rohdaten zu sehen, die von der KI-Unterstützung verwendet werden.
KI‑Unterstützung für die Leistung
Verwenden Sie den Bereich KI-Unterstützung für die Leistung, um die im Leistungsbereich aufgezeichneten Leistungsprofile zu analysieren.
KI-Unterstützung über den Leistungsbereich öffnen
Wenn Sie KI-Unterstützung über den Bereich Leistung öffnen möchten, müssen Sie zuerst ein Leistungsprofil aufzeichnen.
Je nachdem, was Sie untersuchen möchten, können Sie den Bereich **KI-Unterstützung** entweder über einzelne Leistungsstatistiken oder für Aktivitäten in der Ansicht „Leistungstrace“ öffnen.
Leistungsdaten
Öffnen Sie auf dem Tab Statistiken eine Statistik, z. B. **LCP nach Phase** , und klicken Sie dann auf die Schaltfläche KI fragen.
In den Entwicklertools wird der Bereich KI-Unterstützung geöffnet. Diese Leistungsanalyse ist bereits als Kontext für die Unterhaltung ausgewählt.
Leistungstrace-Ansicht
Wenn Sie KI-Unterstützung über die Trace-Ansicht öffnen möchten, klicken Sie mit der rechten Maustaste auf eine Aktivität und wählen Sie die Option KI fragen aus.
In diesem Fall ist diese Aktivität als Kontext für das Gespräch vorausgewählt.
Kontext der Unterhaltung
Die ausgewählte Leistungsaktivität wird als Kontext für Ihre Unterhaltung mit der KI-Unterstützung verwendet. Unten links im Bereich wird ein Verweis auf diese Aktivität angezeigt.
Leistungsdaten
Wenn Sie für einen bestimmten Leistungs-Insight auf KI fragen geklickt haben, wird dieser Insight als ausgewählter Kontext angezeigt. Sie können unter anderen Statistiken auf KI fragen klicken, um Ihre Auswahl zu ändern.
Nachdem Sie eine Unterhaltung begonnen haben, können Sie den Bereich Analyzing insight: ... maximieren, um die von der KI-Unterstützung verwendeten Rohdaten zu sehen.
Traceansicht
Sie können verschiedene Elemente im Leistungs-Trace auswählen. Der Kontext ändert sich dann entsprechend.
KI-Unterstützung verwendet Zeitangaben aus dem ausgewählten Anrufbaum, um Ihren Prompt zu beantworten.
Klicken Sie nach dem Start einer Unterhaltung auf die Schaltfläche im Chip Analyzing call tree, um die von der KI-Unterstützung verwendeten Rohdaten aufzurufen.
KI‑Unterstützung für Quellen
Im Bereich KI-Unterstützung finden Sie Quellen, mit denen Sie nachvollziehen können, welche Dateien von Ihrer Website geladen und verwendet werden.
KI-Unterstützung über den Quellenbereich öffnen
Wenn Sie KI-Unterstützung über den Bereich Quellen öffnen möchten, klicken Sie mit der rechten Maustaste auf eine Datei und wählen Sie die Option KI fragen aus.
Wenn Sie KI-Unterstützung auf diese Weise öffnen, wird die ausgewählte Datei als Kontext für die Unterhaltung vorausgewählt.
Alternativ können Sie auch auf die schwebende Schaltfläche klicken, wenn Sie den Mauszeiger auf eine Datei bewegen.
Kontext der Unterhaltung
Die ausgewählte Datei wird als Kontext für Ihre Unterhaltung mit der KI-Unterstützung verwendet. Unten links im Bereich wird auf diese Datei verwiesen.
Sie können den Kontext ändern, indem Sie im Bereich „Quellen“ auf eine andere Datei klicken.
KI-Unterstützung verwendet den Namen, die URL, die Quellzuordnung (falls verfügbar) und den Inhalt der ausgewählten Datei, um Ihre Fragen zu beantworten.
Klicken Sie nach dem Starten einer Unterhaltung auf die Schaltfläche im Chip Analyzing file, um die von der KI-Unterstützung verwendeten Rohdaten zu sehen.
Gesprächsverlauf
Wenn Sie einen Prompt senden, beginnt die Unterhaltung mit dem Styling-Agent. Um die Informationen zu erhalten, die für die bestmögliche Beantwortung Ihres Prompts erforderlich sind, generiert und führt der Agent JavaScript aus, das Web-APIs aufruft. Der Fortschritt des Kundenservicemitarbeiters wird in Schritten angezeigt. Der anfängliche Status des Schritts ist Investigating….
Das Schrittlabel wird aktualisiert, wenn der Agent spezifischere Aktionen ausführt, um Ihre Frage zu beantworten.
Sobald der Agent eine endgültige Antwort gefunden hat, wird sie unter den Untersuchungsschritten angezeigt, zusammen mit Vorschlägen für Folgeprompts.
Klicken Sie auf einen der vorgeschlagenen Prompts, um die Unterhaltung fortzusetzen. Klicken Sie auf das Dreipunkt-Menü .
eines Untersuchungsschritts, um besser zu verstehen, was die KI-Unterstützung im Hintergrund getan hat.
Wenn Sie einen Fortschrittschip maximieren, sehen Sie den vom Agent ausgeführten Code zusammen mit dem zugehörigen Rückgabewert. Kopieren Sie den ausgeführten Code zur weiteren Verwendung, z. B. zur Ausführung im Konsolenbereich.
Pausierte Unterhaltungen
KI-Unterstützung kann Code mit Nebeneffekten generieren. In diesem Fall wird die Unterhaltung pausiert, bevor der Code ausgeführt wird.
Wenn die Unterhaltung pausiert wird, überprüfen Sie den vom Agenten vorgeschlagenen Code. Klicken Sie auf Weiter, um fortzufahren, oder auf Abbrechen, um die Ausführung zu verhindern.
Änderungen am Arbeitsbereich speichern
Mit einem verknüpften Arbeitsbereichordner können Sie von der KI‑Unterstützung vorgeschlagene Stiländerungen in CSS‑Quelldateien auf Ihrem Computer speichern.
Dazu
Generieren Sie zuerst eine Metadatendatei und verbinden Sie einen Arbeitsbereichordner.
Alternativ können Sie auch einen Ordner manuell hinzufügen.
Starten Sie einen Chat über das Elementfeld.
Verwenden Sie den Prompt KI‑Unterstützung, um Ihr CSS zu ändern.
KI-Unterstützung kann Code generieren und die Ausführung pausieren. Prüfen Sie den Code und klicken Sie auf Weiter, um die Änderungen live zu testen.
Maximieren Sie den Bereich Nicht gespeicherte Änderungen und klicken Sie auf Auf Arbeitsbereich anwenden.
Prüfen Sie die Änderungen in einem
diffund klicken Sie auf Alle speichern.
Weitere Informationen zu diesem Workflow finden Sie unter:
Keine Antwort
KI-Unterstützung kann aus verschiedenen Gründen keine Antworten liefern.
Wenn Sie der Meinung sind, dass Ihr Prompt ein Thema ist, das KI-Unterstützung behandeln können sollte, melden Sie einen Fehler.
Unterhaltungsverlauf
Wenn Sie eine Unterhaltung beginnen, basiert jede nächste Antwort auf Ihren vorherigen Interaktionen mit der KI.
Bei der KI-Unterstützung wird Ihr Unterhaltungsverlauf zwischen den Sitzungen gespeichert. So können Sie auch nach dem Neuladen der Entwicklertools oder von Chrome auf Ihre vorherigen Chats zugreifen.
Mit den Steuerelementen oben links im Bereich können Sie Ihren Unterhaltungsverlauf verwalten.
Neu beginnen
Wenn Sie eine neue Unterhaltung mit dem aktuell ausgewählten Unterhaltungskontext beginnen möchten, klicken Sie auf die Schaltfläche .
Weiter
Wenn Sie eine frühere Unterhaltung fortsetzen möchten, klicken Sie auf die Schaltfläche und wählen Sie sie im Kontextmenü aus.
Löschen
Wenn Sie eine Unterhaltung aus dem Verlauf löschen möchten, klicken Sie auf die Schaltfläche .
Antworten bewerten und Feedback geben
KI-Unterstützung ist eine experimentelle Funktion. Deshalb freuen wir uns über Ihr Feedback, damit wir die Qualität der Antworten und die allgemeine Nutzerfreundlichkeit verbessern können.
Für Antworten abstimmen
Bewerten Sie eine Antwort mit den Schaltflächen Mag ich und Mag ich nicht unter der Antwort.
Antworten melden
Wenn Sie unangemessene Inhalte melden möchten, klicken Sie neben den Abstimmungsschaltflächen auf die Schaltfläche .