Inside PhpSPA
Opinionated tooling without the heavy scaffolding.
PhpSPA bundles routing, hydration, state, and HTTP utilities so your PHP controllers and templates stay expressive. This starter pairs it with Vite + Tailwind for fast feedback and a production-grade asset pipeline.
Runtime
- •
Component.Link navigation & scroll preservation - • Lifecycle hooks (
beforeload, load, custom) - • Request helper with CSRF + compression
- • Layout targets, slot hydration, dynamic titles
Tooling
- • Vite dev server with instant HMR
- • Tailwind v4 with layered tokens
- • TypeScript helpers + store typings
- • Production manifest auto-injection
Typical flow
- 1. Author layouts + routes in
app/pages/*. - 2. Create interactive widgets in
src/ using Vite. - 3. Bind PHP data with
useState() + useEffect(). - 4. Listen to route events via
phpspa.on(). - 5. Deploy with
pnpm build → manifest assets.
Integration
Use PhpSPA inside Laravel, Symfony, CodeIgniter, WordPress—or any custom framework.
- • Mount controllers then swap views inside
<div id="app">. - • Share auth context with Session or scoped hooks.
- • Proxy API calls through PhpSPA
Http\Request.
Deliverables
- •
pnpm dev launches Vite + PHP for hot reload. - •
pnpm build emits versioned assets + manifest. - •
app/layout/layout.php swaps dev/prod automatically. - • Debug hooks log transitions for profiling.
SEO & multi-page
PhpSPA renders every first request through PHP, so crawlers receive fully formed HTML, titles, and meta tags. Define multiple entry points by passing arrays to ->route([...]), scope per-route layouts with ->targetID(), and emit canonical titles via ->title(). Need a classic multi-page site? Simply add more components — each route can hydrate independently but still benefit from SPA navigations once the runtime boots.
- • Static-first payloads keep SEO bots happy.
- • Dynamic metadata comes from PHP before hydration.
- • Array routes let one component serve multiple URLs.
Preloading & composition
Preload layout fragments or sibling apps so they are ready before PhpSPA swaps targets. Use ->name() to give each component a unique key, then chain ->preload('hero', 'sidebar') on the parent. PhpSPA runs those children on the server, caches their HTML, and hydrates them automatically when the main component renders.
return (new Component(fn () => '<Hero />'))
->name('landing')
->preload('hero', 'stats')
->route(['/landing', '/home'])
->targetID('main')You can even preload entire micro-apps (dashboards, modals, counter demos) to avoid waterfalls when users land on a rich layout.
Native performance
The PhpSPA runtime streams responses through the FFIBridge so minification and compression are handled by a C++ extension instead of PHP string operations. Bundles are squeezed by the native compressor, then gzipped or brotlied before the request leaves the server, keeping the templating layer expressive while responses remain lean.
- • Native tokenizer trims whitespace + comments in ~15ms for 300KB payloads.
- • Streaming compressor emits pre-zipped HTML/JS so clients download 30–60% less.
- • Fallbacks detect missing extensions and transparently switch to PHP compressors.
Why teams choose PhpSPA
Single language comfort, multi-surface reach.
Your designers stay in Tailwind, your backend stays in PHP, and PhpSPA binds them with declarative components, typed routes, and stateful transitions.
Feature checklist
- ✅ Multi-target layouts
- ✅ Reactive store bridge
- ✅ Hookable navigation lifecycle
- ✅ CSRF-safe Request helper
- ✅ Compression + UTF-8 tools
- ✅ Type hinting + IDE helpers
PhpSPA unifies PHP-first rendering with Vite tooling, Tailwind styling, typed state maps, and Component.Link navigation so controllers stay expressive while users enjoy SPA-class transitions. The runtime covers lifecycle hooks, CSRF-safe HTTP helpers, and layout slot hydration, letting teams compose multi-target pages without JavaScript glue. Typical projects author routes in app/pages, hydrate widgets from Vite’s src directory, bind stores with useState and useEffect, listen to phpspa.on events, then ship versioned assets through pnpm build while app/layout/layout.php wires dev and prod manifests.The platform embeds opinionated SEO support: every first request renders on the server with canonical titles, per-route metadata, and array-driven routes so a single component can power multiple URLs. Preloading APIs allow parents to name components, queue sibling micro-apps, and hydrate cached HTML instantly, avoiding waterfalls on content-rich layouts. Native performance comes from the FFIBridge C++ extension that tokenizes markup, performs whitespace/comment stripping in ~15ms for 300KB payloads, and streams brotli or gzip output before the response leaves PHP, with automatic fallbacks when the extension is unavailable.Integration guidance highlights Laravel, Symfony, CodeIgniter, WordPress, or bespoke stacks: mount controllers, swap views beneath #app, share auth context, and proxy APIs through PhpSPA\Http\Request. Final calls-to-action reinforce the value proposition—single-language comfort, typed routes, hookable navigation, CSRF-safe forms, compression utilities, and IDE-ready hints—so teams grasp the entire PhpSPA runtime, tooling, and deployment story even if JavaScript is disabled.