By Ilya Grigorik, Google Developer Advocate

Have you ever wondered how a browser converts HTML, CSS, and JavaScript into actual pixels on your screen—a sequence of steps known as the Critical Rendering Path? And, more importantly, how you can optimize your resources so that your web pages render faster on mobile? Well, you can now learn all about that in our new online Udacity course “Website Performance Optimization: Critical Rendering Path”.
This short course will provide the full overview of how the browser constructs a web page: constructing the DOM and CSSOM from your HTML and CSS markup, building the render tree, performing layout, running JavaScript, and painting the pixels. You will learn why CSS blocks rendering, why JavaScript may block DOM construction, and how to measure and optimize the performance of each of the above steps using the Chrome Developer Tools.

Once you’ve completed the course, the interactive quizzes, and the course project, you’ll know everything you need to make all of your mobile pages render in one second or less!

Ilya Grigorik is Developer Advocate at Google, where he spends his days and nights on making the web fast and driving adoption of performance best practices.

Posted by Louis Gray, Googler