Inertia v3 Beta вже тут

Inertia v3 beta — важлива передрелізна версія, яка додає вбудований XHR HTTP-клієнт, новий хук useHttp для окремих HTTP-запитів, оптимістичні оновлення в API роутера й форм, миттєві переходи та інші покращення.

• Вбудований XHR HTTP-клієнт; Axios тепер опційна peer-залежність
• Новий хук useHttp для окремих HTTP-запитів
• Оптимістичні оновлення для router, useForm та useHttp
• Миттєві переходи
• Підтримка SSR у Vite в режимі розробки з простішим налаштуванням
• Хелпери для layout props та опція layout у createInertiaApp()
• І більше

Ось повна доповідь Joe Tannenbaum про Inertia v3 на Laracon EU 2026:

# Що нового

# Built-in XHR HTTP Client

Inertia тепер має власний XHR‑базований HTTP‑клієнт, тож Axios більше не є обовʼязковим. Якщо ваша апка не потребує Axios — можна не встановлювати його; хто звик до Axios, може додати його як peer‑dependency:

import { axiosAdapter } from '@inertiajs/core'
 
createInertiaApp({
    // ...
    http: axiosAdapter(),
})

PR: #2833

# useHttp Hook for Standalone HTTP Requests

Новий хук useHttp дозволяє робити HTTP‑запити поза системою Inertia‑visit. Він дає той самий DX, що й useForm — processing, errors, progress, isDirty — але повертає дані відповіді, не викликаючи навігацію. Підтримує withAllErrors для відображення всіх валідаційних помилок.

const http = useHttp({
    query: '',
})
 
const search = () => {
    http.get('/api/search').then((results) => {
        console.log('Found:', results.length)
    })
}

PRs: #2840, #2880

# Optimistic Updates

Додана підтримка оптимістичних оновлень у router, useForm і useHttp, включно з одночасними оптимістичними оновленнями. Колбек отримує поточні props і повертає оптимістичний стан, який застосовується одразу, із автоматичним відкатом при помилках валідації, помилках серверу або перерваних візитах.

Роутер підтримує як fluent API, так і inline‑опцію:

// Fluent
router
    .optimistic((props) => ({
        todos: [...props.todos, { id: Date.now(), name, done: false }],
    }))
    .post('/todos', { name })
 
// Inline option
router.post('/todos', { name }, {
    optimistic: (props) => ({
        todos: [...props.todos, { id: Date.now(), name, done: false }],
    }),
})

Хук useForm працює аналогічно:

const form = useForm({ name: '' })
 
const addTodo = () => {
    form
        .optimistic((props) => ({
            todos: [...props.todos, { id: Date.now(), name: form.name, done: false }],
        }))
        .post('/todos')
}

Компонент <Form> також отримав проп optimistic для декларативної обробки.

PRs: #2866, #2898, #2881

# Instant Visits

Instant visits дають відчуття миттєвої навігації — сторінка призначення рендериться ще до завершення відповіді сервера.

PR: #2907

# URL Fragment Preservation

Нова серверна опція preserveFragment зберігає хеш‑фрагмент URL під час редиректів. У Laravel можна прикрутити її до redirect‑відповіді:

return redirect('/users')->preserveFragment();

Якщо сервер відправляє preserveFragment: true в Inertia page object, клієнт зберігає фрагмент оригінального запиту, навіть коли URL відповіді відрізняється. Додано також підтримку редиректів, що змінюють хеш‑фрагмент.

PRs: #2897, #2899

# preserveErrors Option for Partial Requests

Додана опція preserveErrors, яка зберігає поточні валідаційні помилки при часткових запитах, щоб помилки не чистилися під час часткового оновлення сторінки.

PR: #2819

# SSR Support in Vite Development Mode

Inertia тепер підтримує SSR у режимі розробки Vite з простішим налаштуванням, що полегшує роботу зі SSR під час розробки.

PR: #2864

# Progress Bar Rewritten with the Popover API

Імплементацію прогрес‑бара переписали з використанням нативного Popover API браузера, замінивши попередній підхід.

PR: #2917

# Layout Props Helpers and layout Option in createInertiaApp()

Додані хелпери для layout props, щоб краще організувати й передавати дані layout. Тепер у createInertiaApp() є опція layout, і функцію можна викликати без аргументів.

PRs: #2859, #2884, #2883

# strictMode Option for React

У React createInertiaApp додали опцію strictMode, щоб увімкнути рендеринг у React StrictMode. Якщо setup не заданий, опція обгортає апку в <StrictMode>. При кастомному setup — обгортайте компоненти вручну.

createInertiaApp({
    strictMode: true,
    // ...
})

PR: #2909

# reloading Slot Prop on <Deferred>

У компоненті <Deferred> зʼявився слот‑проп reloading, щоб показувати індикатор під час часткового перезавантаження. На відміну від fallback, існуючий контент лишається видимим — змінюється лише стан reloading.

<Deferred data="users">
    <template #fallback>
        <span>Loading...</span>
    </template>
 
    <template #default="{ reloading }">
        <span v-if="reloading">Reloading...</span>
 
        <div v-for="user in users" :key="user.id">
            {{ user.name }}
        </div>
    </template>
</Deferred>

PR: #2860

# Generics in <Form> Component

Компонент <Form> тепер підтримує TypeScript generics для кращої інференції типів даних форми.

PR: #2849

# onHttpException for Server-Rendered Error Pages

Серверно відрендерені Inertia‑сторінки помилок тепер тригерять подію onHttpException, що дає єдине місце для обробки HTTP‑виключень незалежно від способу рендерингу.

PR: #2927

# Несумісні зміни

Це бета‑реліз зі значними несумісностями. Ретельно перевірте зміни перед оновленням.

Припинена підтримка фреймворків:

• React нижче v19 більше не підтримується (#2712)
• Svelte 4 більше не підтримується; потрібен Svelte 5 (#2713)

Node.js: Мінімальна версія Node.js тепер v24 (#2847)

ESM‑only: CommonJS‑збірки видалені. Inertia відтепер постачається лише як ESM (#2873)

Axios: Axios більше не обовʼязковий. Встановіть його вручну як peer‑dependency, якщо ваша апка його використовує (#2833)

Видалені експорти: hideProgress() та revealProgress() видалені (#2852)

Перейменовано налаштування: useDataElementForInitialPage перейменовано на useDataAttributeForInitialPage; старий параметр видалено (#2871, #2887)

Перейменовано події: Події invalid та exception перейменовано; додано колбеки для visit (#2869)

Сигнатура resolve(): Функція resolve у createInertiaApp() тепер отримує повний page object як опційний другий аргумент, даючи доступ до props, URL, version та іншого контексту сторінки (#2485):

// Before
resolve: (name) => resolvePageComponent(name, import.meta.glob('./Pages/**/*.vue')),
 
// After
resolve: (name, page) => resolvePageComponent(name, import.meta.glob('./Pages/**/*.vue')),

Поведінка useForm: processing і progress тепер скидаються лише в onFinish, а не раніше в циклі життя компонента (#2838)

Це бета‑реліз і не рекомендується для production. Перед оновленням ознайомтеся з повним changelog.

Джерела

• Full Changelog
• Release