Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

YouTube

Debugging UI Performance Issues - Fast But Not Furious

Web Conferences Amsterdam via YouTube

Overview

Coursera Flash Sale
40% Off Coursera Plus for 3 Months!
Grab it
Explore the intricacies of UI performance optimization in this 44-minute conference talk from performance.now() 2018. Delve into the browser's rendering process and learn how to identify and resolve performance issues in already-loaded pages. Discover which popular UI patterns can negatively impact user experience and how to optimize them. Gain insights on perceived performance, the components of a frame, layer creation, reflows, repaints, and compositing changes. Master the use of browser developer tools such as Performance and Layers tabs in Chrome, and Paint flashing in Firefox to diagnose issues. Examine common performance pitfalls in animations, parallax effects, fixed elements, scrolling events, hover effects, and image handling. Walk away with practical takeaways and resources to enhance your website's performance beyond initial page load, ensuring a smooth and delightful user experience.

Syllabus

Intro
Anna Migas
Perceived performance
What a frame consists of?
What creates new layers?
Layout change (Reflow)
Paint change (Repaint)
Compositing change
Reflows can be quite obvious...
Performance tab (Chrome or Firefox)
Layers tab (Chrome)
Rendering tab (Chrome)
Paint flashing (Firefox)
Performance monitor tab (Chrome)
Animations
requestAnimation Frame
Parallax effect
Fixed elements
Scrolling events
Hover effects
Appending elements
Images: downloads (img tag)
Images: downloads (background img)
Images: content jumps
Images: lazy loading
Takeaways
Resources

Taught by

Web Conferences Amsterdam

Reviews

Start your review of Debugging UI Performance Issues - Fast But Not Furious

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.