FCP marks the exact moment the browser first renders anything visible: a line of text, a background image, an SVG icon. Before FCP, the visitor sees a blank white (or colored) screen and wonders if the page is broken. Google considers FCP under 1.8 seconds "good" and over 3 seconds "poor."
FCP isn't the same as the page being useful — that's closer to Largest Contentful Paint. But FCP is the "proof of life" moment. Psychologically, it's the difference between "this is loading" and "nothing is happening." A fast FCP buys you patience for the rest of the page to finish rendering. A slow one triggers the back button.
What blocks FCP
The usual suspects: render-blocking CSS (the browser won't paint anything until all CSS in <head> is downloaded and parsed), synchronous JavaScript that blocks the parser, large unoptimized web fonts that delay text rendering, and slow server response times. The fastest fix is usually inlining critical CSS and deferring the rest.
For landing pages specifically, be wary of heavy JavaScript frameworks that render the entire page client-side. A React SPA with no server-side rendering might show a blank screen for 2-3 seconds while JavaScript downloads, parses, and executes. Your headline — the most important element on the page — is invisible until that JavaScript finishes. Use SSR or static generation and your FCP will drop dramatically.