fix: eliminate 2s LCP rendering delay from Directus timeout on Hero
All checks were successful
CI / CD / test-build (push) Successful in 10m11s
CI / CD / deploy-dev (push) Successful in 1m17s
CI / CD / deploy-production (push) Has been skipped

The Hero server component awaited getMessages(locale) which called Directus
with a 2-second timeout. On testing.dk0.dev (or when Directus is unreachable),
this blocked the entire Hero render for ~2s → LCP 3.0s / 2320ms rendering delay.

Changes:
- Hero.tsx: remove getMessages() call entirely; use t() for all strings
- messages/en.json + de.json: add hero.badge, hero.line1, hero.line2 keys
- lib/i18n-loader.ts: invert lookup order — JSON first, Directus only as
  override for keys absent from JSON. Previously Directus was tried first
  for every key, causing ~49 parallel network requests per page load in
  HomePageServer (aboutT + projectsT + contactT + footerT translations).
  Now all JSON-backed keys return instantly without any network I/O.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-06 22:36:03 +01:00
parent dacec18956
commit bdf02b2a3a
5 changed files with 40 additions and 37 deletions

View File

@@ -5,6 +5,9 @@ import Hero from '@/app/components/Hero';
jest.mock('next-intl/server', () => ({
getTranslations: () => Promise.resolve((key: string) => {
const messages: Record<string, string> = {
badge: 'Student & Self-Hoster',
line1: 'Building',
line2: 'Stuff.',
description: 'Dennis is a student and passionate self-hoster.',
ctaWork: 'View My Work',
ctaContact: 'Get in touch',
@@ -13,11 +16,6 @@ jest.mock('next-intl/server', () => ({
}),
}));
// Mock directus getMessages
jest.mock('@/lib/directus', () => ({
getMessages: () => Promise.resolve({}),
}));
// Mock next/image
interface ImageProps {
src: string;