News

Server-side Rendering for Inertia.js

Published
Server-side Rendering for Inertia.js image

The Inertia team announced the release of server-side rendering (SSR) for Inertia.js:

Inertia.js applications written in Laravel or Rails now have the added benefit of pre-rendering the initial page load on the server and sending the HTML to the browser. SSR enables users to interact with the page faster and helps search engines crawl pages more quickly.

What I find significant about this work is that typically, SSR means that your server-side is written in Node.js and that something written in PHP or Ruby is out of the question. The beauty of SSR in Inertia.js is that you can write the server-side application in Laravel or Rails, but under-the-hood Inertia.js renders the HTML via a separate Node.js process:

When Inertia detects that it's running in a Node.js environment, it will automatically render the provided page object to HTML and return it.

However, because most Inertia applications are built in languages such as PHP or Ruby, we'll need to hand the request over to a separate Node.js service so that it can render the page for us and return the generated HTML to the browser when it's done.

SSR is available for Vue, Vue 3, and React adapters at the release announcement—with the Svelte adapter in the works. Today, you can get started with Server-side rendering by checking out the documentation and setup guide.

Paul Redmond photo

Staff writer at Laravel News. Full stack web developer and author.

Sponsored

masteringlaravel logo
Laravel Code Review

Get expert guidance in a few days with a Laravel code review

Visit Laravel Code Review

The latest

View all →
Laravel Read-Through Filesystem: Lazy Storage Migration image

Laravel Read-Through Filesystem: Lazy Storage Migration

Read article
Read-Through Disks and Debounced Listeners in Laravel 13.26 image

Read-Through Disks and Debounced Listeners in Laravel 13.26

Read article
Lerd: A Free, Open Source Herd Alternative for Linux and macOS image

Lerd: A Free, Open Source Herd Alternative for Linux and macOS

Read article
Let's Encrypt HTTPS on an IP Address With FrankenPHP image

Let's Encrypt HTTPS on an IP Address With FrankenPHP

Read article
Laravel Chores: Resumable Data Operations and Cleanups image

Laravel Chores: Resumable Data Operations and Cleanups

Read article
NativePHP v4: Build Native iOS and Android UI in Blade image

NativePHP v4: Build Native iOS and Android UI in Blade

Read article