Analyse
Geraete-Info
Das Geräte-Info-Tool liest alle zugänglichen Browser- und Geräteeigenschaften aus und stellt sie übersichtlich dar. Entwickler und Tester können damit Geräteparameter wie Bildschirmauflösung, Pixeldichte (DPR), Touch-Unterstützung, installierte Sprachen und verfügbare Web-APIs schnell erfassen. Das Tool arbeitet rein clientseitig und sendet keine Daten an externe Server.
Was zeigt das Geräte-Info-Tool?
Das Tool greift auf die Browser-APIs window, screen, navigator und MediaQueryList zu und zeigt eine Vielzahl von Geräteeigenschaften: Bildschirmbreite und -höhe (screen.width/height), verfügbarer Viewport (window.innerWidth/Height), Device Pixel Ratio (window.devicePixelRatio) für HiDPI- und Retina-Displays, Farbtiefe (screen.colorDepth), Orientierung (portrait/landscape), Anzahl logischer CPU-Kerne (navigator.hardwareConcurrency) und Gerätespeicher in GB (navigator.deviceMemory). Zudem werden Touch-Fähigkeit (maxTouchPoints), Betriebssystem, Sprachen (navigator.languages), Online-Status und Cookie-Aktivierung angezeigt.
Wie funktioniert das Tool?
Alle Daten werden direkt aus den JavaScript-Browser-APIs abgerufen – es sind keine Netzwerkanfragen oder Berechtigungen erforderlich (außer für optionale Features wie Geolocation oder Batterie-Status). Der User-Agent-String wird geparst, um Browser-Engine, Version, Betriebssystem und Gerätekategorie (Desktop, Mobil, Tablet) zu ermitteln. Für Browser-Feature-Detection wird geprüft, welche Web-APIs verfügbar sind: WebGL, WebRTC, Service Workers, Web Assembly, Pointer Events und mehr. Das Ergebnis zeigt, was eine Website über das Gerät weiß, ohne explizite Benutzer-Erlaubnis.
Typische Anwendungsfälle
- Responsive-Design-Debugging – tatsächliche Viewport-Größe und DPR eines Geräts prüfen
- Browser-Kompatibilität testen – welche APIs sind in diesem Browser verfügbar?
- Performance-Tuning – CPU-Kerne und Arbeitsspeicher als Grundlage für Worker-Thread-Optimierung
- QA-Dokumentation – Geräteparameter für Bug-Reports und Testberichte erfassen
Schritt-für-Schritt-Anleitung
- Schritt 1: Seite im zu testenden Browser und auf dem Zielgerät aufrufen.
- Schritt 2: Alle Geräteparameter werden automatisch ausgelesen und angezeigt.
- Schritt 3: Relevante Werte (Viewport, DPR, User-Agent) für die aktuelle Aufgabe ablesen.
- Schritt 4: Daten als Screenshot oder über die Kopieren-Funktion für Bug-Reports sichern.
Beispiel
Eingabe
Seitenaufruf auf einem iPhone 15 Pro (Safari)
Ausgabe
Bildschirm: 393x852 px (physisch: 1179x2556) DPR: 3 Viewport: 393x852 px Betriebssystem: iOS 17 Browser: Safari 17 CPU-Kerne: 6 Touch: Ja (5 Punkte) WebGL: Ja
Tipps & Hinweise
- Tipp: Ein Device Pixel Ratio > 1 bedeutet, dass CSS-Pixel kleiner als physische Pixel sind – Bilder sollten in doppelter oder dreifacher Auflösung bereitgestellt werden.
- Tipp: navigator.hardwareConcurrency gibt die Anzahl logischer Kerne zurück – nutzen Sie diesen Wert, um die optimale Anzahl von Web-Workern für parallele Berechnungen zu bestimmen.
- Tipp: navigator.deviceMemory ist auf Datenschutzgründen auf Werte wie 0.25, 0.5, 1, 2, 4, 8 gerundet und gibt nur eine grobe Kategorie an.
Häufige Fragen
Warum unterscheidet sich die angezeigte Bildschirmgröße von der Gerätespezifikation?
Browser geben CSS-Pixel zurück, nicht physische Pixel. Auf einem iPhone 15 Pro mit physisch 1179x2556 Pixeln und DPR=3 berichtet der Browser 393x852 CSS-Pixel. Physische Pixel = CSS-Pixel × DPR.
Kann das Tool den genauen Gerätetyp (Modellname) ermitteln?
Nein – Browser-APIs geben aus Datenschutzgründen keinen Modellnamen zurück. Der User-Agent enthält in modernen Browsern nur generische Plattformangaben (z. B. 'Mobile' für Mobilgeräte). Genaue Modellnamen erfordern native App-APIs oder proprietäre Erkennungsdienste.
Geraete-Info
Zeigt Informationen ueber dein aktuelles Geraet – Bildschirmgroesse, Pixeldichte, User-Agent, Browser-Funktionen und mehr.
Tool öffnen