Layout calculates the dimensions and positions of elements in the page. Paint puts the pixels on screen and composite handles complex stuff like z-indexing. If you have elements that are above or below each other, that's where this calculation is being made.
How do we see this flow in the browser? Look at this application. This application is a very simple one. What it does, it shows us a button on screen. This bottom when it's clicked, it calls for an add item function that creates a new element of type Dev, set it's in inner text to high and appends it to our operative.
If we click here, we'll see the high being added to the screen. Let's see the critical rendering path in this simple case. We go into the performance tool of Chrome DevTools. Click F12 then go to the performance tab, and let's start recording. We start recording. We'll click our item a few times, and then we'll stop.