Microsoft hat kürzlich neue verbesserte Netzwerktools in angekündigt F12-Entwicklertools für das Neue Microsoft Edge-Browser in Windows 10 nach einer großen Nachfrage von Entwicklern. Als Entwickler haben Sie allen Grund, sich zu freuen, da Sie jetzt an einem verbesserten Satz von Tools arbeiten können.

Schauen wir uns einige der wichtigsten Verbesserungen an, die Microsoft übernommen hat.

Microsoft Edge F12-Entwicklertools

Selbst wenn Sie ein Anfänger sind, finden Sie es extrem einfach, auf Microsoft Edge F12-Entwickler zuzugreifen, da Sie nur sehr wenige Schritte befolgen müssen. Alles, was Sie tun müssen, ist zu klicken und zu öffnen Mehr Aktionen Menü und wählen Sie „F12 Entwicklertools“. Dadurch werden die Tools automatisch abgedockt gestartet.

Erweiterung der Netzwerktools in Edge

Der erste Schritt, den Microsoft bei Verbesserungen unternimmt, besteht darin, die Netzwerktools neu zu gestalten, damit die Entwickler eine sauberere Erfahrung machen können. Als nächstes fügte das Team von Microsoft auch a hinzu Starten und stoppen Schaltfläche in der Symbolleiste, um Entwicklern mehr Flexibilität beim Umgang mit HTTP-basiertem Netzwerkverkehr zu bieten.

Es gibt auch eine neue Schaltfläche namens „Inhaltstyp-Filter“, der hinzugefügt wurde, damit Entwickler den Filter setzen und nur die gewünschte Art von Datenverkehr erhalten können. Auf diese Weise können Sie viele unabhängige Netzwerkaufrufe überspringen und erhalten gleichzeitig relevante Informationen über die Art und Anzahl von Netzwerkfehlern, die Anzahl der Anfragen, die Übertragungsgröße der Antwortdaten, die Downloadzeiten usw.

Lesen: So deaktivieren Sie die F12-Verknüpfung für Microsoft Edge Developer Tools.

Sie können auch alle Informationen in einer JSON-HAR-Datei exportieren und nachverfolgen.

Bemerkenswerte Verbesserungen der F12-Entwicklertools für Microsoft Edge

Die Listen der verbesserten Elemente, die in New Microsoft Edge enthalten sind, lauten wie folgt:

• Aktualisieren Sie immer vom Server: Diese Funktion stellt sicher, dass Sie mit der neuesten Version einer Ressource vom Server testen und nicht mit einer veralteten.
• Cache und Cookies löschen: Dadurch wird sichergestellt, dass der Cache Ihres Browsers vor dem Laden der nächsten Seite gelöscht wird, und Sie können die Cookies mit der Verknüpfung löschen, ohne auch nur zu den Browsereinstellungen zu gehen
• Sitzung löschen– Sie können die Schaltfläche „Sitzung löschen“ verwenden, um alle während der Sitzung aufgezeichneten Netzwerkverkehrsinformationen zu löschen
• Einträge beim Navigieren löschen– Mit dieser Funktion können Sie sich nur auf Ressourcen konzentrieren, die während der letzten Seitenaktualisierung oder Navigation geladen wurden. Sie können dies sogar mit der letzten Sitzung vergleichen, indem Sie diese Funktion einfach deaktivieren

Aufnahme der Übersichtsansicht in die Netzwerktools

• Name: Dies umfasst den Namen und die URL der angeforderten Ressource
• Protokoll: Schließen Sie das Protokoll ein, das zum Anfordern der Ressource verwendet wird
• Methode: Zeigt die in der Anfrage verwendete HTTP-Methode an
• Ergebnis: Dies zeigt den Antwortstatuscode und die Textnachricht, wie sie vom Server zurückgegeben werden
• Inhaltstyp: Zeigt den MIME-Typ der Antwort an, wie er vom Server zurückgegeben wird
• Erhalten: Die Gesamtgröße der vom Server gelieferten Antwortnutzdaten
• Zeit: Zeigt die Zeit an, die die Ressource benötigt, um den Download zu erhalten
• Zeiten: Zeigt die grafische Darstellung der Netzwerkaktivität, die im Laufe der Zeit aufgetreten ist

Wenn Sie an einer detaillierteren Ansicht der Informationen interessiert sind, können Sie die Detailansicht anstelle der Zusammenfassungsansicht wählen. Informationen wie Header, Body, Parameter usw. werden in verschiedenen Abschnitten der Detailansicht angezeigt. Sie müssen auf die Anfrage doppelklicken und die Informationen im Seitenbereich lesen.

Eine wichtige Sache, die hier notiert werden sollte, sagt Microsoftist, dass diese neuen erweiterten Funktionen von Netzwerktools auch in der IE11-Umgebung und Edge verfügbar sind.

Sehen Sie sich nun an, wie Sie User-Agent, Modus, Anzeige und Geolokalisierung in den Edge-Entwicklertools ändern können.

Sind Edge-Entwicklungstools mit Chrome identisch?

Ja, sie sind gleich. Beide Browser verwenden dieselbe Chromium-Browser-Engine und bieten daher dieselben Funktionen in den Entwicklertools. Sie können jedoch die Microsoft Edge DevTools-Erweiterung für Visual Studio Code verwenden, mit der Sie die Browserelemente und Netzwerktools innerhalb des VS-Codes verwenden können.

Wie verwende ich EDGE-Entwicklungstools?

Öffnen Sie den Microsoft Edge-Webbrowser, um auf die Entwicklertools zuzugreifen. Klicken Sie auf Ihrer Tastatur auf F12. Klicken Sie auf das Symbol „Weitere Tools“ und dann auf „Weitere Tools“ > „Entwicklertools“, wenn Sie Strg+Umschalt+I drücken, oder klicken Sie optional auf das Symbol „Einstellung und weitere Auslassungspunkte“.