Die DevTools im Panel nutzen
Die Aufmerksamkeit bekommt die Mehrgeräte-Vorschau. Der Grund, nicht mehr in den Browser zu wechseln, sind die DevTools darunter.
Das Simulator Panel hat Konsole, Netzwerk und Speicher eingebaut, dazu Performance- und Accessibility-Profiling. Die meisten nutzen die Gerätevorschau und öffnen diese nie — schade, denn sie beantworten genau die Fragen, die die Vorschau aufwirft.
Netzwerk zuerst, immer
Wenn eine Seite bei einer Breite spinnt und bei einer anderen nicht, klärt der Netzwerk-Tab das in Sekunden. Sie suchen zwei Dinge: eine Anfrage, die still gescheitert ist, und eine Anfrage, die zweimal lief.
Das Zweite überrascht die meisten. Eine Komponente, die beim Resize neu rendert, fragt oft erneut an, und der einzige Ort, an dem das sichtbar wird, ist ein Netzwerkpanel mit zwei identischen Zeilen. Die Seite funktioniert weiter, also merkt es niemand, bis die Rechnung oder das Rate Limit kommt.
Die Konsole bei jeder Breite, nicht nur bei einer
Fehler sind nicht breitenunabhängig. Ein Layout, das an einem kleinen Breakpoint zusammenfällt, kann dort werfen, wo Desktop es nicht tut — eine Messung, die null zurückgibt, ein Element, das bei dieser Größe noch nicht im DOM ist.
Lesen Sie die Konsole also gezielt in der Vorschau des kleinen Telefons. Sie wird übersprungen, und dort häufen sich die Fehler.
Speicher, für den Bug, den nur Sie haben
Das Speicher-Werkzeug beendet die Debatte „bei mir läuft es“. Die Hälfte dieser Fälle ist ein veralteter Wert im Local Storage aus einem älteren Build — ein Feature-Flag, ein zwischengespeichertes Token, ein weggeklicktes Banner, das nie wiederkommt.
Leeren und neu laden, bevor Sie eine Stunde in einen Fehler stecken, den kein neuer Besucher je sehen wird.
Der Profiling-Lauf, der sich einmal lohnt
Führen Sie vor einem Launch Performance- und Accessibility-Profiling bei der kleinsten unterstützten Breite aus. Nicht Desktop — auf dem kleinen Telefon wird eine schwere Seite wirklich langsam und fallen Touch-Ziele durch.
Eine Einschränkung, klar gesagt: Das misst die Seite in Ihrem Browser auf Ihrer Maschine. Es sagt etwas über die Seite, nicht über ein vier Jahre altes Android im Zug. Behandeln Sie einen guten Wert als notwendig, nicht als hinreichend.
Häufig gestellte Fragen
Warum die Konsole bei mehreren Breiten prüfen?
Fehler sind nicht breitenunabhängig. Ein Layout, das an einem kleinen Breakpoint zusammenfällt, kann dort werfen, wo Desktop es nicht tut — eine Messung, die null liefert, ein Element, das bei dieser Größe noch nicht im DOM ist.
Wie finde ich eine doppelte Anfrage?
Der Netzwerk-Tab zeigt zwei identische Zeilen. Komponenten, die beim Resize neu rendern, fragen oft erneut an; die Seite läuft weiter, und niemand merkt es, bis ein Rate Limit oder eine Rechnung kommt.
Reicht ein guter Profiling-Wert vor dem Launch?
Nein. Er misst die Seite in Ihrem Browser auf Ihrer Maschine. Er ist notwendig, aber nicht hinreichend — ein echtes günstiges Telefon in einem echten Netz ist der Test, den er nicht ersetzt.
