Inertia.js has quietly become the glue that holds modern Laravel + Vue applications together. It gives you the single-page app feel without building a separate API, and for many teams it replaced the awkward dance of mixing Blade templates with Vue components. Now, with the Inertia.js v3 beta officially announced, there is a lot to unpack.
This post is a practical walkthrough of what changed, what it means for your existing projects, and whether you should upgrade today or wait.
Table of Contents
- What Changed in Inertia v3
- The No-Axios Change
- Optimistic Updates
- SSR and Vite Implications
- Migration Considerations
- Upgrade Checklist
- Who Should Upgrade Now vs. Wait
What Changed in Inertia v3
Inertia v3 is not a ground-up rewrite, but it is more than a minor version bump. The core philosophy remains the same — build SPAs using server-side routing and controllers — but the internals have been modernized significantly.
Here are the headline changes:
- Axios removed as a dependency. Inertia now uses the native Fetch API for all HTTP requests.
- First-class optimistic updates. You can now reflect UI changes immediately while the server processes the request in the background.
- Improved SSR support. Server-side rendering has been reworked for better compatibility with Vite and modern deployment targets.
- Smaller bundle size. Dropping Axios and cleaning up internals shaved meaningful kilobytes off the client bundle.
- Updated TypeScript types. The type definitions have been overhauled to be stricter and more useful, especially for shared page props.
- New async request lifecycle. The visit lifecycle hooks (
onBefore,onStart,onFinish, etc.) have been refined with better async handling.
If your app is a standard Laravel + Vue + Inertia stack, most of these changes work in your favor without requiring dramatic rewrites.
The No-Axios Change
This is the change that will get the most attention. Inertia v3 drops Axios entirely and moves to the browser’s native Fetch API.
Why This Matters
For most Inertia apps, you never interacted with Axios directly — Inertia handled it internally. But if you customized Axios defaults (interceptors, base URLs, custom headers), that code will need to change.
In Inertia v2, many teams configured Axios interceptors for things like:
- Attaching authorization tokens
- Handling 401/403 responses globally
- Adding custom request headers
In v3, you will handle these through Inertia’s own request hooks or by configuring the Fetch options directly.
What to Do
If you have a file like resources/js/bootstrap.js with Axios interceptor setup specifically for Inertia requests, you will need to migrate that logic. If you use Axios elsewhere in your app (for non-Inertia API calls), Axios itself still works fine — it just is no longer bundled with Inertia.
// Inertia v3 — setting custom headers on every request
import { router } from '@inertiajs/vue3'
router.on('before', (event) => {
event.detail.visit.headers['X-Custom-Header'] = 'value'
})Optimistic Updates
This is arguably the most exciting addition. Optimistic updates let you update the UI immediately when a user takes an action, without waiting for the server response.
How It Works
When you submit a form or trigger a visit, you can provide an optimistic callback that immediately mutates the page props. If the server request succeeds, the real data replaces the optimistic data seamlessly. If it fails, Inertia rolls back the UI to the previous state.
import { router } from '@inertiajs/vue3'
router.post('/tasks/1/complete', {}, {
optimistic: (page) => {
// Immediately mark the task as complete in the UI
const task = page.props.tasks.find(t => t.id === 1)
if (task) task.completed = true
},
})Why This Is a Big Deal for Laravel + Vue Teams
Previously, if you wanted optimistic UI behavior in an Inertia app, you had to manage local component state alongside Inertia’s page props, which was awkward and error-prone. Now it is a first-class feature with automatic rollback on failure.
This is especially useful for:
- Todo/task toggles
- Like/upvote buttons
- Inline editing
- Drag-and-drop reordering
SSR and Vite Implications
SSR Changes
Inertia v3 overhauls the SSR setup. The SSR server is now lighter and works better with modern Node.js versions. If you were using the @inertiajs/server package, the setup process has changed.
Key SSR differences in v3:
- Simplified SSR entry point. The
ssr.jsfile structure has been streamlined. - Better Vite integration. The SSR build step works more naturally with
laravel-vite-pluginwithout extra configuration hacks. - Faster cold starts. The SSR server boots faster, which matters if you are running it in a serverless or containerized environment.
Vite Considerations
If you are using Laravel Vite (and you should be), the upgrade is fairly smooth. Make sure you are on a recent version of laravel-vite-plugin (v1.x) and update your Inertia packages together.
npm install @inertiajs/vue3@next
# If using SSR
npm install @inertiajs/vue3@next @vue/server-rendererThe Vite config itself should not need changes for most projects. The main thing to watch is that your ssr.js entry point follows the new conventions documented in the Inertia SSR guide.
Migration Considerations
Breaking Changes to Watch
- Axios removal. If you rely on Axios interceptors for Inertia requests, migrate to Inertia’s built-in hooks.
- Visit lifecycle changes. Some lifecycle hook signatures have changed. Review the upgrade guide for specifics.
- TypeScript stricter types. If you use TypeScript, expect some type errors after upgrading. The types are better now, but they may catch issues your code previously ignored.
- SSR entry point. If you use SSR, the
ssr.jsfile needs to be updated to match the new structure.
What Stays the Same
The good news is that the core patterns have not changed:
router.visit(),router.get(),router.post()all work the same way.- The
<Link>component API is unchanged. - Page props, shared data, and
usePage()work as before. - Your Laravel-side
Inertia::render()calls do not need changes.
For most apps, the migration is a few hours of work, not a few days.
Server-Side Package
Do not forget to update the server-side package as well:
composer update inertiajs/inertia-laravelMake sure you check the inertiajs/inertia-laravel release notes for any changes to middleware or response handling.
Upgrade Checklist
Here is a quick checklist to work through when upgrading from Inertia v2 to v3:
- Update npm packages:
npm install @inertiajs/vue3@next - Update Composer package:
composer update inertiajs/inertia-laravel - Search for Axios interceptors in your codebase that touch Inertia requests and migrate them to Inertia hooks
- Review visit lifecycle hooks (
onBefore,onStart,onSuccess,onError,onFinish) for signature changes - Update SSR entry point if you use server-side rendering
- Run TypeScript compiler if applicable and fix any new type errors
- Test form submissions thoroughly — the Fetch migration can surface subtle differences in how file uploads and multipart data are handled
- Test error handling — make sure 422 validation errors, 403/404 responses, and 500 errors still render correctly
- Check CORS configuration if your app makes cross-origin Inertia requests — Fetch handles CORS differently than Axios
- Run your full test suite and do a manual smoke test of critical user flows
Who Should Upgrade Now vs. Wait
Upgrade Now If:
- You are starting a new project. There is no reason to start on v2 today. Use the v3 beta and grow with it.
- Your app is relatively simple with standard Inertia usage (no heavy Axios customization, no complex SSR setup). The upgrade will be straightforward and you will benefit from the smaller bundle and optimistic updates.
- You want optimistic updates badly. If your app has a lot of interactive UI where perceived speed matters (dashboards, task managers, collaborative tools), v3’s optimistic updates are worth the early adoption.
Wait If:
- You have heavy Axios interceptor customization. If your app has elaborate request/response interceptors that modify Inertia’s behavior, budget time for a careful migration. Waiting for v3 stable and more community examples may save you headaches.
- You depend on SSR in production. SSR in a beta version introduces risk. If SSR is critical to your SEO or performance strategy, wait for the stable release and let others shake out the bugs.
- Your team is mid-sprint on a feature. Do not upgrade in the middle of active feature development. Finish what you are building, then upgrade in a dedicated branch.
The Honest Take
Inertia v3 is a solid, overdue modernization. Dropping Axios for Fetch is the right call — Axios was unnecessary weight for what Inertia needs. Optimistic updates fill a real gap that previously required awkward workarounds. The SSR improvements make deployment easier.
That said, it is still a beta. If your Laravel + Vue app is in production and making money, there is no shame in waiting for the stable release. The upgrade path is clear enough that waiting a few weeks will not make it harder.
For new projects, use v3 from day one. For existing projects, start a branch, run through the checklist above, and see how it goes. You will probably be surprised at how little breaks.