Seminare
Seminare

Browser-Entwicklertools - Professionelles Web Debugging & Optimization

Seminar - GFU Cyrus AG

Die Teilnehmer erlangen umfassende praktische Fähigkeiten im professionellen Einsatz von Browser-Entwicklertools für Debugging, Performance-Optimierung und Web-Entwicklung. Sie lernen komplexe CSS- und JavaScript-Probleme zu diagnostizieren, Netzwerkanalysen durchzuführen und Performance-Bottlenecks zu identifizieren. Nach dem Seminar können sie Entwicklertools effizient für tägliche Entwicklungsaufgaben nutzen und komplexe Frontend-Probleme systematisch lösen
Termin Ort Preis*
firmenintern auf Anfrage auf Anfrage
*Alle Preise verstehen sich inkl. MwSt.

Detaillierte Informationen zum Seminar

Inhalte:
  • 1. Einführung in Browser-Entwicklertools
    • Überblick der Hauptbrowser
      : Chrome DevTools, Firefox Developer Edition, Safari Web Inspector
    • Zugangsmöglichkeiten
      : Tastenkürzel, Menüs, Kontextmenüs
    • Grundlayout
      : Element Inspector, Console, Network, Performance Tabs

  • 2. Elements Panel & DOM Manipulation
    • Live HTML/CSS Editing
      : Echtzeit-Änderungen im DOM und Styles
    • Box Model Visualisierung
      : Padding, Margin, Border interaktiv analysieren
    • CSS Debugging
      : Spezifitätsprobleme, Inheritance, Cascade nachvollziehen

  • 3. Console für Entwicklung & Debugging
    • JavaScript Execution
      : Code direkt im Browser ausführen und testen
    • Logging Methoden
      : console.log, warn, error, table für verschiedene Zwecke
    • Advanced Console Features
      : Grouping, Timing, Memory Monitoring

  • 4. Network Analysis & Optimization
    • HTTP Request Monitoring
      : Alle Netzwerkanfragen im Detail analysieren
    • Performance Metrics
      : Ladezeiten, Dateigrößen, Caching-Verhalten
    • Throttling Simulation
      : Langsame Netzwerke und Mobile Devices emulieren

  • 5. Performance & Profiling Tools
    • Performance Monitor
      : Echtzeit-Metriken für CPU, RAM, DOM Nodes
    • JavaScript Profiling
      : Performance-Bottlenecks in Code identifizieren
    • Memory Leaks erkennen
      : Speicherprobleme diagnostizieren und beheben

  • 6. Application Panel & Storage
    • Local Storage & Session Storage
      : Client-seitige Datenspeicherung
    • Cookie Management
      : Cookies anzeigen, bearbeiten und löschen
    • Service Worker Debugging
      : Progressive Web App Entwicklung

  • 7. Security & Accessibility
    • Security Analysis
      : Mixed Content, HTTPS Probleme identifizieren
    • Accessibility Tree
      : Barrierefreiheit testen und verbessern
    • Color Contrast Checking
      : WCAG Compliance sicherstellen

  • 8. Mobile Development & Device Simulation
    • Responsive Design Mode
      : Verschiedene Viewports und Geräte testen
    • Touch Events Simulation
      : Mobile Interaktionen debuggen
    • Device Emulation
      : Spezifische Geräte und Netzwerkbedingungen

  • 9. Praxisübung: Performance Audit
    • Aufgabe
      : Durchführung eines komplettem Performance Audits einer Website
    • Bonus
      : Erstellung eines Optimierungsplans basierend auf den Ergebnissen




Zielgruppe:
  • Frontend-Entwickler und Web-Designer
  • Quality Assurance Engineer und Tester
  • Fullstack-Entwickler und Web-Project-Manager




Seminarkennung:
S6045
Nach unten
Nach oben
Wir setzen Analyse-Cookies ein, um Ihre Zufriedenheit bei der Nutzung unserer Webseite zu verbessern. Diese Cookies werden nicht automatisiert gesetzt. Wenn Sie mit dem Einsatz dieser Cookies einverstanden sind, klicken Sie bitte auf Akzeptieren. Weitere Informationen finden Sie hier.
Akzeptieren Nicht akzeptieren









Um Spam abzuwehren, geben Sie bitte die Buchstaben auf dem Bild in das Textfeld ein:

captcha



Bei der Verarbeitung Ihrer personenbezogenen Daten im Zusammenhang mit der Kontaktfunktion beachten wir die gesetzlichen Bestimmungen. Unsere ausführlichen Datenschutzinformationen finden Sie hier. Bei der Kontakt-Funktion erhobene Daten werden nur an den jeweiligen Anbieter weitergeleitet und sind nötig, damit der Anbieter auf Ihr Anliegen reagieren kann.







Um Spam abzuwehren, geben Sie bitte die Buchstaben auf dem Bild in das Textfeld ein:

captcha