Запропонувати правкуПокращити цю статтюДопрацюйте відповідь до «Що таке static metadata?». Ваші зміни проходять модерацію перед публікацією.Потрібне підтвердженняКонтентЩо ви змінюєте🇺🇸EN🇺🇦UAПереглядЗаголовок (UA)Коротка відповідь (UA)**Static metadata** у Next.js - це метадані, які **відомі заздалегідь** і не залежать від запиту, параметрів маршруту чи даних користувача. **Ключове:** вони описуються один раз і використовуються при кожному рендері сторінки чи layout'а - це фіксований SEO-опис сторінки або розділу.Показується над повною відповіддю для швидкого нагадування.Відповідь (UA)Зображення**Static metadata** у Next.js - це метадані, які **відомі заздалегідь** і не залежать від запиту, параметрів маршруту чи даних користувача. Вони описуються **один раз** і використовуються при кожному рендері сторінки чи layout'а. Простіше кажучи: > static metadata - це фіксований SEO-опис сторінки чи розділу. --- ## Як задається static metadata Static metadata оголошується через експорт об'єкта `metadata`: ```ts export const metadata = { title: 'Про компанію', description: 'Інформація про нашу компанію' } ``` Next.js автоматично перетворює це на: - `<title>` - `<meta name="description">` - та інші потрібні теги Без ручної роботи з `<head>`. --- ## Де можна використовувати static metadata Static metadata можна задавати в: - `page.tsx` - `layout.tsx` - вкладених layout'ах - route groups Метадані **успадковуються згори вниз**. --- ## Коли використовувати static metadata Static metadata підходить, коли: - контент сторінки не змінюється - URL завжди описує одне й те саме - не потрібні параметри (`params`) - не важливі cookies, headers, авторизація Приклади: - головна сторінка - сторінка «Про нас» - лендинги - документація - розділи сайту --- ## Що можна описати Через static metadata можна задати: - `title` - `description` - `keywords` - `robots` - `icons` - Open Graph - Twitter Cards - `alternates` (canonical, hreflang) Все в одному об'єкті. --- ## Зв'язок із продуктивністю Static metadata: - не потребує виконання коду - не робить запитів - може бути оброблена на етапі білда Це: - швидше - передбачуваніше - ідеально для SEO --- ## Відмінність від dynamic metadata | Static metadata | Dynamic metadata | |---|---| | Об'єкт `metadata` | Функція `generateMetadata` | | Не залежить від даних | Залежить від `params`, fetch | | Фіксована | Обчислюється щоразу | | Швидше | Трохи важче | | Підходить для статичних сторінок | Для динамічних маршрутів | --- ### Підсумок Static metadata - це: - заздалегідь відомі метадані - простий і декларативний підхід - найкращий варіант для статичних сторінок - швидкий і безпечний спосіб SEO-налаштуваньДля рев’юераПримітка для модератора (необов’язково)Бачить лише модератор. Прискорює рев’ю.