Я переделал кучу секций с клиентских на серверные компоненты на этом самом сайте, чтобы срезать несколько КБ JS с первоначальной загрузки. Паттерн выглядел нормально — async компонент, await getTranslations(), готово.
Потом билд крашнулся с:
Functions cannot be passed directly to Client Components unless you explicitly expose it by marking it with "use server"
Ни файла, ни номера строки. Трюк: серверный компонент передавал компоненты иконок (которые являются функциями) как props в клиентский компонент. React сериализует props через границу, а функцию сериализовать нельзя.
Фикс был маленький — серверный компонент рендерит иконки как JSX (<CalendarIcon />) и передаёт их как ReactNode вместо передачи ссылки на компонент. Одна строчка изменения на поверхности, но сдвиг ментальной модели важен: всё, пересекающее границу server → client, должно быть сериализуемым JSON или сериализуемыми React-элементами.
Хорошее напоминание, что "use server" и "use client" — не просто прагмы. Это граница сериализации, и всё, что кладёшь в props, должно это уважать.