Udacity Logo
Log InSign Up
Free

Browser Rendering Optimization

Course

This course will demystify the browser's rendering pipeline and make it easy for you to build high performance web apps.

This course will demystify the browser's rendering pipeline and make it easy for you to build high performance web apps.

Last Updated March 7, 2022

Prerequisites:

No experience required

Course Lessons

Lesson 1

The Critical Rendering Path

Follow along with Paul Lewis and Cameron Pittman as they explain common performance issues on the web and what we should be hoping to achieve in terms of speed.

Lesson 2

App Lifecycles

Learn about the four parts of a web app's lifecycle: RAIL (Response, Animate, Idle, and Load). You'll discover how these phases cause jank in your web apps.

Lesson 3

Weapons of Jank Destruction

Learn how to use Chrome's Developer Tools Timeline to find page jank and remove it from your site.

Lesson 4

JavaScript

Learn how to use JavaScript to optimize animations and use web workers to speed up performance.

Lesson 5

Styles and Layout

Discover how changing styles can result in surprisingly slow page speed. You'll also learn how to prevent Forced Synchronous Layouts.

Lesson 6

Compositing and Painting

Learn how to manage page layers and improve page performance using the Chrome Dev Tools Paint Profiler.

Taught By The Best

Photo of Cameron Pittman

Cameron Pittman

Instructor

Photo of Paul Lewis

Paul Lewis

Instructor

Taught By The Best

Photo of Cameron Pittman

Cameron Pittman

Instructor

Photo of Paul Lewis

Paul Lewis

Instructor

Get Started Today

Browser Rendering Optimization