The Critical Rendering Path is the sequence of steps the browser goes through to convert the HTML, CSS and JavaScript into actual pixels on the screen. If we can optimize the critical rendering path, we can make our pages faster.
When you type an URL and hit enter, the browser sends a request to the server. The server returns a response with the HTML to the browser, which somehow needs to convert the markup into something that we can see on the screen.
The browser follows a well defined set of steps and it all starts with processing the HTML and building the DOM.