Inertia + Svelte blog performance: deferred props without skeleton regret

Short answer: The aviwebsquad.in blog index loads critical post list HTML in the initial response (crawlable fallback) and defers secondary props—tags cloud, heavy filters—so first paint stays snappy on mobile India 4G.

This pairs directly with crawlable HTML for SEO and AEO.

Problem I hit

Pure SPA blog indexes score well in Lighthouse after hydration but look empty to curl—and Google’s first crawl saw thin pages. Dual rendering fixed trust; deferred props fixed weight.

Pattern on BlogController@index

return Inertia::render('blog/Index', [
    'posts' => $posts,
    'filters' => Inertia::optional(fn () => $this->filterMeta()),
]);

optional() (v3) replaces old lazy patterns. Secondary data loads after mount; skeleton pulses on the Svelte side.

Crawlable partial still includes posts

resources/views/partials/crawlable/blog-index.blade.php mirrors the first page of results in <div id="inertia-static-fallback">. Bots and users without JS see real titles and links.

What I will not defer

• Post title, excerpt, canonical URL on show pages
• JSON-LD FAQ blocks on guides
• Pagination rel links (server-rendered in layout)

Measuring

• Laravel Pulse slow requests
• Browser devtools on Moto G4 throttling
• pest smoke tests for 200 + fallback markers (Pest before deploy)

FAQ

Axios removed in Inertia v3?

Yes—use useHttp for client fetches. This site keeps most reads server-side.

Infinite scroll?

Not yet—pagination keeps crawl paths clean for AI search and helpful content.

Svelte 5 runes?

Public components use runes; patterns match the Aviwebsquad build log conventions in-repo.

Layout props without prop drilling

useLayoutProps() shares nav badges (unread contact count) without reloading post lists—Inertia v3 feature documented in Laravel Boost skills.

Prefetch on hover

Category chips call router.prefetch on mouseenter with 200ms debounce—cheap win on desktop, disabled on prefers-reduced-motion.

Bundle discipline

Heroicons imported per-icon, not entire set. Vite manualChunks keeps vendor-svelte under 120KB gzip on last check.

FAQ (extended)

SSR?

@inertiajs/vite dev SSR is on; production serves crawlable fallback without Node—see crawlable HTML post.

Third-party scripts?

AdSense tags load only after approval—no premature clutter hurting CWV.