Sign up to save your podcasts
Or
Share Revision 637: Das Devtools Performance Tab
Share to email
Share to Facebook
Share to X
Share to email
Share to Facebook
Share to X
Or
Revision 637: Das Devtools Performance Tab
In dieser Episode tauchen wir tief in die Chrome DevTools ein und beschäftigen uns mit der Frage, wie wir das Performance-Tab optimal nutzen können, um wertvolle Einsichten in die Ladezeiten und Rendering-Prozesse unserer Webseiten zu gewinnen.
Schaunotizen
[00:01:20] Das Devtools Performance Tab
Wir nehmen alles mit, da bleibt kein Auge trocken: Recording mit Reload oder nicht? Was bedeuten die verschiedenen Tortenfarben? Wie funktioniert das mit den verschiedenen horizontalen Lanes und kann man dort auch die Core Web Vitals ablesen? Was zeigt der Callstack? Wann braucht man CPU-Throttling? Wofür macht man Screenshots und wann zeichnet man die Speicherauslastung mit auf? Welche Rolle spielen Browser-Extensions bei der Performance-Analyse?
Links
Performance of CSS Variables
Lisi Linhart stellte sich schon 2017 die Frage, ob und wenn ja wann CSS Variablen bzw. Custom Propeties einen Impact auf die Browser-Performance haben.
Benchmarking the performance of CSS @property
Im Jahr 2024 wiederholte Bramus van Damme Lisis Test und ging zusätzlich der Frage nach, welchen Einfluss @property-Deklarationen dabei haben.
Chromium Perf Test Runner
Low Level Performance-Tests in Chrome automatisiert ausführen
Webpagetest
Die Mutter aller Performance-Testing Tools.
SpeedCurve
SaaS, der auf Webpagetest aufbaut und es um viele nützliche Bestandteile ergänzt.
View all episodes
By Vanessa Otto, Peter Kröner, Hans Christian Reinl, Stefan Baumgartner, Christian »Schepp« SchaeferIn dieser Episode tauchen wir tief in die Chrome DevTools ein und beschäftigen uns mit der Frage, wie wir das Performance-Tab optimal nutzen können, um wertvolle Einsichten in die Ladezeiten und Rendering-Prozesse unserer Webseiten zu gewinnen.
Schaunotizen
[00:01:20] Das Devtools Performance Tab
Wir nehmen alles mit, da bleibt kein Auge trocken: Recording mit Reload oder nicht? Was bedeuten die verschiedenen Tortenfarben? Wie funktioniert das mit den verschiedenen horizontalen Lanes und kann man dort auch die Core Web Vitals ablesen? Was zeigt der Callstack? Wann braucht man CPU-Throttling? Wofür macht man Screenshots und wann zeichnet man die Speicherauslastung mit auf? Welche Rolle spielen Browser-Extensions bei der Performance-Analyse?
Links
Performance of CSS Variables
Lisi Linhart stellte sich schon 2017 die Frage, ob und wenn ja wann CSS Variablen bzw. Custom Propeties einen Impact auf die Browser-Performance haben.
Benchmarking the performance of CSS @property
Im Jahr 2024 wiederholte Bramus van Damme Lisis Test und ging zusätzlich der Frage nach, welchen Einfluss @property-Deklarationen dabei haben.
Chromium Perf Test Runner
Low Level Performance-Tests in Chrome automatisiert ausführen
Webpagetest
Die Mutter aller Performance-Testing Tools.
SpeedCurve
SaaS, der auf Webpagetest aufbaut und es um viele nützliche Bestandteile ergänzt.
More shows like Working Draft
View all
Bits und so
25 Listeners
Freak Show
9 Listeners
c’t uplink - der IT-Podcast aus Nerdistan
6 Listeners
heiseshow
2 Listeners
Logbuch:Netzpolitik
5 Listeners
Computer und Kommunikation
10 Listeners
Finanzfluss Podcast
26 Listeners
Mac & i - der Apple-Podcast
0 Listeners
Bit-Rauschen: Der Prozessor-Podcast von c’t
0 Listeners
Ist das eine Blase?
2 Listeners
Der KI-Podcast
10 Listeners
KI-Update – ein heise-Podcast
2 Listeners
Passwort - der Podcast von heise security
3 Listeners
15 Minuten. Der tagesschau-Podcast am Morgen
12 Listeners
Hateland
4 Listeners