Panoramica delle piattaforme

NSH funziona su telefoni, desktop e web: iOS, Android, macOS, Windows, Linux, GPUI e pagine web. Ognuna ha un proprio backend che disegna con la UI nativa della piattaforma, quindi un’app è fatta di view UIKit su un iPhone, view AppKit su un Mac, widget GTK 4 su Linux, elementi GPUI in un’app GPUI e HTML in un browser, con il testo, l’input, l’accessibilità e la modalità scura della piattaforma. Tutto ciò che sta sopra il backend è condiviso: il grafo reattivo, il renderer, il layout Taffy, i componenti e i moduli nativi sono lo stesso codice Rust ovunque, quindi un’app gira su tutte. Un’app scritta in Rust è quel codice più il tuo crate, senza VM JavaScript; un’app TSX esegue i suoi moduli su QuickJS sopra di esso (Sviluppare con Rust).

Su ogni piattaforma un’app si usa in due modi: pacchettizzata come app installabile di quella piattaforma (nsh package), oppure incorporata in un’app nativa tua, sia che l’host colleghi una root Rust sia che carichi TSX a runtime. La sviluppi con nsh run (le modifiche a Rust ricompilano e riavviano l’app, le modifiche a TSX sono aggiornamenti a caldo).

#In sintesi

• GPUI disegna le app con GPUI, il framework del progetto gemello GPUI Kit, su macOS, Windows e Linux allo stesso modo: è il backend per l’incorporamento in app GPUI e GPUI Kit, che inseriscono il proprio AppView nel loro albero di elementi. Le app desktop standalone vengono eseguite e pacchettizzate con il backend di ciascun sistema operativo (AppKit, Win32, GTK 4).
• Web renderizza le app come HTML in una pagina del browser: nsh package --target web pubblica un sito statico per qualsiasi web server o CDN, con il motore e il crate di un’app Rust compilati in WebAssembly, e una pagina tua incorpora un’app con createPlayer o un iframe. Alimenta anche le demo dal vivo e il playground di questo sito.
• Mac Catalyst esegue il backend iOS in una finestra delle dimensioni di un iPhone (390×844) su un Mac, per lo sviluppo. Selezionalo con --target catalyst per vedere come appare un’app su un telefono.

#Sviluppare e pacchettizzare

nsh run sceglie la piattaforma della macchina stessa quando non indichi --target: AppKit su macOS, la finestra GTK su Linux e la finestra Win32 su Windows. I telefoni si raggiungono da un computer: iOS da un Mac con Xcode, Android da macOS, Linux o Windows con l’Android SDK (Installazione).

Un’app Rust (il suo nsh.json indica il componente "root") si esegue e si pacchettizza dalla propria directory: nsh compila il runner dell’app per il target, con il tuo crate e senza QuickJS. Un’app TSX indica il proprio entry:

# A Rust app, from its directory
nsh run --target macos             # or ios, android, windows, linux, web, catalyst
nsh package --target macos         # or ios, ios-simulator, android, windows, linux, web

# A TSX app
nsh run App.tsx --target macos     # or ios, android, windows, linux, gpui, web, catalyst
nsh package App.tsx --target macos

Ogni sistema operativo desktop pacchettizza le app con il proprio backend, compilato per la macchina su cui gira: pacchettizza un’app Mac su un Mac, un’app Windows su Windows e un’app Linux su Linux. Pacchettizzazione descrive l’output, la firma e le icone di ogni target.

#Incorporare in un’app nativa

Un host Rust monta una root Rust (Root::of::<App>()) come AppSource::Rust o App::Rust, e fornisce ai propri motori i set di UI dell’app con set_ui_sets, così il TSX che carica importa i componenti e i moduli propri dell’app. Ogni view è un motore, e un’app può mostrarne diversi. L’host registra le proprie view native perché le app le usino su ogni piattaforma (Componenti nativi).

#Scrivere per ogni piattaforma

La maggior parte di un’app non richiede controlli sulla piattaforma: elementi, stili, layout e moduli si comportano allo stesso modo ovunque. Dove le piattaforme differiscono, NSH dà alla differenza un posto unico (Codice specifico per piattaforma):

• L’ambiente dice dove gira l’app: in Rust os(), idiom() e is_desktop() (nsh_core::prelude), in TSX platform.os, platform.idiom, platform.desktop e platform.select da nsh. Il sistema operativo è iOS, Android, macOS, Windows, Linux o il web.
• Le prop specifiche di una piattaforma vanno in ios={{…}}, android={{…}}, web={{…}} o desktop={{…}} in TSX (desktop: macOS, Windows, Linux e browser desktop).
• L’input segue la piattaforma. I telefoni hanno il tocco e la tastiera software; i desktop hanno il mouse, il trackpad e la tastiera.

I componenti di un’app sono disegnati con le primitive di NSH, quindi funzionano sia sui desktop sia sui telefoni, con lo stesso aspetto su entrambi. Un layout desktop si costruisce con le primitive (view, text, scroll, virtual_list, …; View, Text, Scroll, List, … in TSX) e un controllo per il desktop, come fa il layout desktop della galleria:

use nsh_core::prelude::*;

#[component]
pub fn Shell() -> impl IntoElement {
    // macOS, Windows, Linux and desktop browsers get a sidebar; phones get tabs.
    view()
        .flex_1()
        .child(if is_desktop() { sidebar_layout() } else { tab_layout() })
}

fn sidebar_layout() -> AnyElement {
    view().flex_1().flex_row().into_element()
}

fn tab_layout() -> AnyElement {
    view().flex_1().flex_col().into_element()
}

import { View } from "nsh";
import { platform } from "nsh";

export function Shell() {
  // macOS, Windows, Linux and desktop browsers get a sidebar; phones get tabs.
  return <View class="flex-1">{platform.desktop ? <SidebarLayout /> : <TabLayout />}</View>;
}

function SidebarLayout() {
  return <View class="flex-1 flex-row" />;
}

function TabLayout() {
  return <View class="flex-1 flex-col" />;
}

Ogni backend elenca ciò che fa a modo proprio: macOS, Windows, Linux, GPUI.

#Vedi anche

• Per iniziare: una prima app, eseguita su ogni piattaforma.
• Sviluppare con Rust: app scritte in Rust, e Rust con TSX.
• Installazione: gli strumenti necessari a ogni piattaforma.
• Architettura: cosa è condiviso e cosa fa ogni backend.