This is the overview bar on Chrome DevTools Timeline panel.
From top to bottom:
yellow/green ticks are input activity, e.g. mouse moves/click, key press. Each has it's own color. Btw you have to enable a Chrome DevTools experiment to see this bar.red stripes bar is page responsiveness indicator. If you have a particular issue at some point it shows a red bars. The problems detected include long frames, excessive or forced layouts, etc.green chart is current frame rate. The higher -- the better. Max is 60fps.next bar is CPU utilization. The full bar height means 100% CPU is busy. Colors correspond to the type of activity: yellow is JavaScript, purple is style recalc or page layout, green is rendering/painting, blue is html parsing or blocking network interactions.thin stripes below CPU are network requests currently in flight. Colors depict content type: blue is html, green is media (images, fonts etc), purple is css, yellow is JavaScript, grey is for all others.