Основной момент этого обновления - это Rust-based компилятор, Turbopack, который обеспечивает значительные улучшения стабильности и производительности. Turbopack ускоряет запуск локального сервера до 53,3%, а обновления кода становятся до 94,7% быстрее благодаря Fast Refresh.
В Next 9, были введены маршруты API, что упростило создание внутренних эндпоинтов. Вы создаете новый файл в каталоге api/, чтобы определить эндпоинт вашего API, например app/api/products.ts. Затем, на стороне клиента, вы можете использовать React для взаимодействия с этим маршрутом API.
С Next 14, упрощается работа по созданию мутаций данных. Цель состоит в том, чтобы улучшить пользовательский опыт, особенно когда пользователи имеют медленное подключение к сети или отправляют формы с устройств с низким энергопотреблением.
С серверными действиями вы можете определить функцию, которая безопасно выполняется на сервере и вызывается прямо из ваших React-компонентов. Этот функционал построен на канале React Canary и стабилен для принятия новых функций. В версии 14 Next обновлен до последней версии React Canary, включая стабильные серверные действия.
Пример использования:
export default function Page() {
async function create(formData: FormData) {
'use server'
const id = await createItem(formData)
}
return (
<form action={create}>
<input type='text' name='name' />
<button type='submit'>Submit</button>
</form>
)
}Серверные действия тесно интегрированы в модель маршрутизатора приложений, позволяя выполнять различные задачи, такие как повторная валидация кэшированных данных, перенаправление на разные маршруты, обработка cookies и многое другое.
Одной из самых волнующих функций, над которой работает Next, является Частичная предварительная отрисовка (Prerendering). Эта оптимизация предназначена для быстрой отрисовки динамического контента, объединяя лучшие стороны серверного рендеринга (SSR), статической генерации сайтов (SSG) и инкрементной статической перевалидации (ISR).
В Next.js 14 обработка метаданных была уточнена. Важные метаданные о viewport, цветовой схеме и теме отправляются в браузер до того, как ваш контент будет потоково отправлен с сервера. Это обеспечивает более плавный пользовательский опыт и предотвращает проблемы, такие как мерцание цвета темы или сдвиги макета из-за изменений viewport.
В Next 14 была усовершенствована обработка метаданных. Важные метаданные о viewport, цветовой схеме и теме отправляются в браузер до того, как ваш контент будет потоково отправлен с сервера. Это обеспечивает более плавный пользовательский опыт и предотвращает такие проблемы, как мерцание цвета темы или изменение макета из-за изменения области просмотра.
Некоторые параметры метаданных устарели, но были введены новые, такие как viewport и generateViewport. Эти новые опции обеспечивают более гибкий и эффективный подход к управлению метаданными.
Чтобы помочь разработчикам максимально эффективно использовать Next, был запущен новый бесплатный курс на Next Learn. Этот курс охватывает широкий спектр тем, от настройки базы данных до оптимизации шрифтов и изображений, обработки ошибок и улучшения доступности. Это ценный ресурс как для начинающих, так и для опытных разработчиков.
Next 14 предлагает ряд улучшений, которые делают разработку еще более быстрой, эффективной и удобной. Независимо от того, это небольшое приложение или крупномасштабный проект, Next в очередной раз доказывает свою ценность в качестве веб-фреймворка. Не пропустите эти классные обновления.
Next 14! 🥂