Що таке first contentful paint (FCP)?

First Contentful Paint (FCP) - це метрика, яка показує, коли на екрані вперше з'являється будь-який контент: текст, зображення, SVG, фон тощо.

---

#Що зараховується як «contentful»

• текстові блоки (навіть одна буква)
• зображення (<img>, фони через CSS)
• canvas, svg
• іконки, логотипи

Не зараховується: білий фон, порожній <div>, індикатор завантаження без контенту

---

#Навіщо потрібна

FCP показує, коли користувач вперше бачить, що сторінка взагалі почала завантажуватися. Це впливає на сприйняття швидкості і «живості» сайту.

---

#Приклад

Якщо FCP = 1.2 сек, це означає, що перший видимий елемент з'явився на екрані через 1.2 секунди після початку завантаження сторінки.

---

#Норми (за Google)

• < 1.8 сек: добре
• 1.8-3 сек: середньо

3 сек: погано

---

#Висновок

FCP - це «момент першого візуального відгуку». Чим раніше він настає, тим швидше користувач відчуває, що сайт працює.