NativePHP v4: Native iOS & Android UI in Blade | Mohamed Said [ ![Mohamed Said](https://cdn.msaied.com/01KT78WE565VEMM3PSNQAAB0MH.png) Mohamed Said Laravel Backend Engineer ](https://msaied.com) [ Home ](https://msaied.com) [ Projects ](https://msaied.com/projects) [ Articles ](https://msaied.com/articles) [ Certificates ](https://msaied.com/certificates) [ Contact ](https://msaied.com#contact-section) [ ](https://github.com/EG-Mohamed) [ Home ](https://msaied.com) [ Projects ](https://msaied.com/projects) [ Articles ](https://msaied.com/articles) [ Certificates ](https://msaied.com/certificates) [ Contact ](https://msaied.com#contact-section) [ home ](https://msaied.com) [ articles ](https://msaied.com/articles) NativePHP v4: Build Real Native iOS and Android UI with Blade and SuperNative On this page 1. [ What SuperNative Actually Is ](#what-supernative-actually-is) 2. [ Writing a SuperNative Screen ](#writing-a-supernative-screen) 3. [ Testing Without a Device ](#testing-without-a-device) 4. [ Keeping Existing Web Views ](#keeping-existing-web-views) 5. [ What Changed in v4.1 ](#what-changed-in-v41) 6. [ Upgrading from v3 ](#upgrading-from-v3) 7. [ Key Takeaways ](#key-takeaways) ![NativePHP v4: Build Real Native iOS and Android UI with Blade and SuperNative](https://cdn.msaied.com/560/3f885ba0bc9406711e8a9cde2a61faba.png) [ Laravel ](https://msaied.com/articles?category=laravel) #NativePHP #Laravel #Mobile #SwiftUI #Jetpack Compose #Blade NativePHP v4: Build Real Native iOS and Android UI with Blade and SuperNative =============================================================================== 17 Aug 2026 4 min read ![Mohamed Said](https://cdn.msaied.com/01KT78WE565VEMM3PSNQAAB0MJ.jpg) Mohamed Said Table of contents 1. [ 01 What SuperNative Actually Is ](#what-supernative-actually-is) 2. [ 02 Writing a SuperNative Screen ](#writing-a-supernative-screen) 3. [ 03 Testing Without a Device ](#testing-without-a-device) 4. [ 04 Keeping Existing Web Views ](#keeping-existing-web-views) 5. [ 05 What Changed in v4.1 ](#what-changed-in-v41) 6. [ 06 Upgrading from v3 ](#upgrading-from-v3) 7. [ 07 Key Takeaways ](#key-takeaways) NativePHP v4 ships a feature called **SuperNative** that compiles Blade components into real SwiftUI views on iOS and Jetpack Compose views on Android. There is no web view involved, no HTML-to-native converter, and no virtual machine sitting alongside PHP. Simon Hamp and Shane Rosenthal unveiled it at The Vibes, a 100-person event in Boston on 30 July 2026, the day after Laracon US. What SuperNative Actually Is ---------------------------- NativePHP built its own Blade engine that converts Blade components into a fixed-length binary byte array instead of HTML. An interpreter on the native side reads that representation and constructs the SwiftUI or Compose view tree directly. Because PHP and the native layer share memory, there is no network round-trip and no bridge serialisation on every interaction. The component set is called **EDGE** (Element Definition and Generation Engine). Elements like `` and `` map to platform-native layout primitives, and Tailwind utility classes drive the layout rather than CSS. Writing a SuperNative Screen ---------------------------- A screen is now a PHP class extending `NativeComponent`, not a web route returning HTML. Public properties hold state, public methods are actions, and attributes handle reactive behaviour: ```php class DeliveryTracker extends NativeComponent { #[Locked] public int $deliveryId; public string $status = 'awaiting_pickup'; #[Poll(5000)] public function syncFromDatabase(): void { $delivery = Delivery::findOrFail($this->deliveryId); $this->status = $delivery->status; } public function render(): View { return view('native.delivery-tracker'); } } ``` Routes live in `routes/mobile.php` and use a `Route::native` macro: ```php Route::native('/deliveries/{deliveryId}', DeliveryTracker::class) ->layout(DeliveryLayout::class) ->name('deliveries.show'); ``` The Blade view uses native primitives styled with Tailwind: ```blade {{ str($status)->headline() }} Confirm receipt ``` v4 also adds `@pressDown` and `@pressUp` for press-and-hold interactions. Testing Without a Device ------------------------ Because a screen publishes a tree rather than rendering pixels, you can test it in CI with Pest: ```php it('confirms receipt of a delivery', function () { $delivery = Delivery::factory()->create(['status' => 'out_for_delivery']); Native::visit("/deliveries/{$delivery->id}") ->assertSee('Out For Delivery') ->tap('Confirm receipt') ->assertSet('status', 'received'); }); ``` `php artisan native:make-test DeliveryTracker` scaffolds the file. No simulator required. Keeping Existing Web Views -------------------------- You do not have to rewrite a v3 app. A web view is now a component inside a native screen: ```blade ``` Each embedded web view gets its own PHP runtime and is not booted until a web route actually renders. What Changed in v4.1 -------------------- - `#[Locked]` prevents two-way bindings from overwriting protected properties. - `TreeObservers` expose element trees for debugging and session recording tools. - `TreeSpy` testing utility lets tests assert on intermediate render frames. - `NativeRouteFallback` controls what a browser sees on a native-only route. - The Tailwind parser now warns about unsupported classes instead of silently ignoring them. Upgrading from v3 ----------------- The one breaking change is dependency-related. `Device`, `Dialog`, `File`, and `System` are now bundled in `nativephp/mobile`, so the four standalone plugin packages must be removed: ```bash php artisan native:plugin:uninstall --core-v4 composer update php artisan native:install --force ``` Facades and events are unchanged, so existing `Dialog::alert()` calls continue to work. Key Takeaways ------------- - SuperNative compiles Blade to SwiftUI and Jetpack Compose—no web view, no bridge overhead. - Screens are PHP classes; templates are Blade; tests are Pest and run in CI without a simulator. - Web views still work and can be mixed with native screens one route at a time. - The only breaking change in v4 is removing four now-bundled plugin packages. - `php artisan native:jump` and the free Jump companion app let you preview on real hardware over Wi-Fi without Xcode or Android Studio. --- *Source: [NativePHP v4: Build Native iOS and Android UI in Blade — Laravel News](https://laravel-news.com/nativephp-v4-supernative)* Found this useful? [ ](https://twitter.com/intent/tweet?url=https%3A%2F%2Fmsaied.com%2Farticles%2Fnativephp-v4-build-real-native-ios-and-android-ui-with-blade-and-supernative&text=NativePHP+v4%3A+Build+Real+Native+iOS+and+Android+UI+with+Blade+and+SuperNative) [ ](https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fmsaied.com%2Farticles%2Fnativephp-v4-build-real-native-ios-and-android-ui-with-blade-and-supernative) Frequently Asked Questions ---------------------------- 3 questions Q01 Does NativePHP v4 still support web views, or do I have to rewrite my app? Web views are still fully supported in v4. A web view is now a `<webview>` component you embed inside a native screen rather than the entire app, so you can migrate one screen at a time while leaving the rest as-is. Q02 What is the breaking change when upgrading from NativePHP v3 to v4? The only breaking change is that the Device, Dialog, File, and System plugins are now bundled in `nativephp/mobile`. Composer will refuse to resolve until the four standalone packages are removed. Run `php artisan native:plugin:uninstall --core-v4`, then `composer update` and `php artisan native:install --force`. Q03 Can I test SuperNative screens without a physical device or simulator? Yes. Because a screen publishes an element tree rather than rendering pixels, the Pest test suite mounts components in-process using `Native::test()` or `Native::visit()`. Tests run in CI without a simulator or connected device. Continue reading More Articles --------------- [ View all ](https://msaied.com/articles) [ ![Laravel Lock: Distributed Locks for Models and Routes](https://cdn.msaied.com/562/7649de72113e99332a9f7e25015f9397.png) Laravel Distributed Locks Composer Package ### Laravel Lock: Distributed Locks for Models and Routes Laravel Lock is a package by Md Mahedi Zaman Zaber that wraps distributed locking behind a fluent builder, a H... ![Mohamed Said](https://cdn.msaied.com/01KT78WE565VEMM3PSNQAAB0MJ.jpg) Mohamed Said 17 Aug 2026 4 min read Read ](https://msaied.com/articles/laravel-lock-distributed-locks-for-models-and-routes) [ ![How Two Non-Developers Built laracon.us/photos with Claude, Laravel, and Laravel Cloud](https://cdn.msaied.com/561/aa231bfcc6b487d352abf7be487875d3.png) Laravel Cloud Claude AI AI-assisted development ### How Two Non-Developers Built laracon.us/photos with Claude, Laravel, and Laravel Cloud Laravel's field marketers built a real, production photo-sharing app for Laracon US 2026 using Claude AI, the... ![Mohamed Said](https://cdn.msaied.com/01KT78WE565VEMM3PSNQAAB0MJ.jpg) Mohamed Said 17 Aug 2026 4 min read Read ](https://msaied.com/articles/how-two-non-developers-built-laraconusphotos-with-claude-laravel-and-laravel-cloud) [ ![Job Batching with Laravel Concurrency: Parallel Work Without the Chaos](https://cdn.msaied.com/559/d55e86a2ecbe32de5e2196f5be63511d.png) laravel concurrency queues ### Job Batching with Laravel Concurrency: Parallel Work Without the Chaos Learn how to combine Laravel's Concurrency facade with job batching to run parallel workloads safely, avoid sh... ![Mohamed Said](https://cdn.msaied.com/01KT78WE565VEMM3PSNQAAB0MJ.jpg) Mohamed Said 17 Aug 2026 4 min read Read ](https://msaied.com/articles/job-batching-with-laravel-concurrency-parallel-work-without-the-chaos) [ ![Mohamed Said](https://cdn.msaied.com/01KT78WE565VEMM3PSNQAAB0MH.png) Mohamed Said Laravel Backend Engineer ](https://msaied.com)Senior Backend Engineer specializing in Laravel, scalable SaaS platforms, APIs, and cloud infrastructure. I build secure, high-performance web applications that help businesses grow. Explore - [Home](https://msaied.com) - [Projects](https://msaied.com/projects) - [Articles](https://msaied.com/articles) - [Certificates](https://msaied.com/certificates) - [Contact](https://msaied.com#contact-section) Connect - [ hello@msaied.com ](mailto:hello@msaied.com) - [ +20 109 461 9204 ](tel:+201094619204) © 2026 Mohamed Said. All rights reserved. [ ](https://github.com/EG-Mohamed) [ ](https://www.linkedin.com/in/msaiedm/) [ ](https://wa.me/201094619204) [ ](mailto:hello@msaied.com) [ ](https://drive.google.com/file/u/0/d/1MF20IPRJyzfy32mhEutjL5EpSls0w2Q8/view)