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.
By Ilya
Grigorik, Google Developer Advocate