Что такое Server Actions
Server Actions — feature Next.js App Router (stable с Next 14, 2023), async функции на сервере, вызываемые прямо из React компонентов (форма или button). Без необходимости writing API route. Помеченые "use server" directive. Progressive enhancement: работают без JS через native form submission. Замена для API-route + client-side fetch-pattern для mutations.
Ниже: подробности, пример, смежные термины, FAQ.
Подробности
- Directive:
"use server"в начале async function - Form:
<form action={submitAction}>— работает без JS - Optimistic UI: useOptimistic hook для instant feedback
- Revalidation: revalidatePath() / revalidateTag() — инвалидирует cache
- Security: всегда re-validate session + авторизация в action (не полагайтесь на page guard)
Пример
"use server";
export async function createPost(formData) {
const session = await auth();
if (!session) throw new Error('Unauthorized');
await db.post.create({ data: { title: formData.get('title') } });
revalidatePath('/posts');
}Смежные термины
Почему нам доверяют
Как это работает
Введите URL страницы
Lighthouse анализирует
Получите CWV и советы
Почему скорость сайта важна?
Скорость загрузки напрямую влияет на конверсию, SEO-позиции и удовлетворённость пользователей. Google использует Core Web Vitals как фактор ранжирования. Каждая лишняясекунда загрузки может стоить до 7% конверсии.
Lighthouse-анализ
Анализ на основе Google Lighthouse: Performance, Accessibility, Best Practices, SEO.
Core Web Vitals
LCP (скорость отрисовки), FID (интерактивность), CLS (визуальная стабильность) — ключевые метрики Google.
Анализ ресурсов
Разбивка по типам: HTML, CSS, JavaScript, изображения, шрифты. Размер, количество запросов, блокирующие ресурсы.
Действенные советы
Конкретные рекомендации с оценкой экономии: сжатие изображений, кеширование, минификация и т.д.
Mobile vs Desktop
- Тестирование на эмуляции Moto G Power (медленный CPU)
- Сеть: 4G (1.6 Mbps, 150ms RTT)
- Строже оценивает скорость
- Google индексирует mobile-first
- Приоритет для SEO-оптимизации
- Высокая производительность CPU
- Быстрое соединение без ограничений
- Результаты обычно выше на 20-40 баллов
- Важен для B2B и корпоративных сайтов
- Используйте для baseline-сравнений
Кому это нужно
SEO-специалисты
Core Web Vitals для ранжирования
Разработчики
оптимизация производительности
Маркетологи
скорость = конверсия
DevOps
регрессия производительности
Частые ошибки
async/defer блокируют отрисовку. Переместите в конец или добавьте атрибут.Cache-Control браузер перезагружает CSS/JS при каждом визите.Лучшие практики
loading="lazy" для изображений ниже first fold.brotli on;Cache-Control: max-age=31536000, immutable. HTML: max-age=0, s-maxage=60.<link rel="preload"> для шрифтов и CSS. Уменьшает LCP на 200-500ms.Получите больше с бесплатным аккаунтом
История проверок скорости, сравнение с конкурентами и мониторинг PageSpeed.
Зарегистрироваться (FREE)Больше по теме
Часто задаваемые вопросы
Server Actions vs API routes?
Server Actions — short-lived, вызываются из компонента, type-safe, RPC-like. API routes — public endpoints для external clients.
Безопасны ли?
Требуется re-validate auth + input внутри action. Next.js добавляет CSRF protection автоматически. Но всегда проверяйте ownership (IDOR).
Работают без JavaScript?
Да! Если form action — Server Action, submit работает через native form POST без JS. Progressive enhancement.