Creazione di un addon di Phi Silica

Questa guida illustra come creare un componente aggiuntivo nativo C# che chiama l'API Phi Silica AI nell'app Electron. Phi Silica è un modello linguistico di piccole dimensioni che viene eseguito localmente nei dispositivi Windows 11 con npu (unità di elaborazione neurale).

Prerequisiti

Prima di iniziare questa guida, assicurarsi di avere:

• Completata la configurazione dell'ambiente di sviluppo
• Copilot+ PC - Phi Silica richiede un dispositivo con un'unità di elaborazione neurale (NPU)

Passaggio 1: Creare un componente aggiuntivo nativo C#

Ora per la parte interessante: creiamo un componente aggiuntivo nativo che chiama le API Windows! Si userà un modello C# che sfrutta node-api-dotnet per collegare JavaScript e C#.

npx winapp node create-addon --template cs

Verrà creata una csAddon/ cartella con:

• addon.cs - Il codice C# che chiamerà le API di Windows
• csAddon.csproj - File di Project con riferimenti a Windows SDK e SDK per app di Windows
• README.md - Documentazione su come usare il componente aggiuntivo

Il comando aggiunge anche uno script al tuo build-csAddon per la creazione del componente aggiuntivo e uno script al tuo clean-csAddon per la pulizia degli artefatti di compilazione:

{
  "scripts": {
    "build-csAddon": "dotnet publish ./csAddon/csAddon.csproj -c Release",
    "clean-csAddon": "dotnet clean ./csAddon/csAddon.csproj"
  }
}

Il modello include automaticamente riferimenti a entrambi gli SDK, quindi è possibile iniziare immediatamente a chiamare Windows API.

Verificare che tutto sia configurato correttamente creando il componente aggiuntivo:

# Build the C# addon
npm run build-csAddon

Passaggio 2: Aggiungere funzionalità di intelligenza artificiale con Phi Silica

Si aggiungerà ora un'API SDK per app di Windows reale. Verrà usato il modello di intelligenza artificiale Phi Silica per riepilogare il testo direttamente nel dispositivo.

Aprire csAddon/addon.cs e aggiungere questo codice:

using System;
using System.Threading.Tasks;
using Microsoft.JavaScript.NodeApi;
using Microsoft.Windows.AI;
using Microsoft.Windows.AI.Text;

namespace csAddon
{
    [JSExport]
    public class Addon
    {
        /// <summary>
        /// Summarizes the provided text using the Phi Silica AI model.
        /// </summary>
        /// <param name="text">The text to summarize</param>
        /// <returns>A summary of the input text</returns>
        [JSExport]
        public static async Task<string> SummarizeText(string text)
        {
            try
            {
                var readyState = LanguageModel.GetReadyState();
                if (readyState is AIFeatureReadyState.Ready or AIFeatureReadyState.NotReady)
                {
                    if (readyState == AIFeatureReadyState.NotReady)
                    {
                        await LanguageModel.EnsureReadyAsync();
                    }

                    using LanguageModel languageModel = await LanguageModel.CreateAsync();
                    TextSummarizer textSummarizer = new TextSummarizer(languageModel);

                    var result = await textSummarizer.SummarizeParagraphAsync(text);

                    return result.Text;
                }

                return "Model is not available";
            }
            catch (Exception ex)
            {
                return $"Error calling Phi Silica API: {ex.Message}";
            }
        }
    }
}

Passaggio 3: Compilare il componente aggiuntivo C#

Ora, ricompila il componente aggiuntivo:

npm run build-csAddon

Questo compila il codice C# usando native AOT (compilazione ahead-of-time), che:

• Crea un .node file binario (formato di componente aggiuntivo nativo)
• Riduce il codice inutilizzato per diminuire la dimensione del bundle
• Non richiede runtime .NET sui computer di destinazione
• Offre prestazioni native

Il componente aggiuntivo compilato sarà in csAddon/dist/csAddon.node.

Passaggio 4: Testare l'API Windows

Verificare ora che il componente aggiuntivo funzioni chiamandolo dal processo principale. Aprire src/main.js e seguire questa procedura:

4.1. Caricare il componente aggiuntivo C#

Aggiungi questo alle altre istruzioni require all'inizio del file:

const csAddon = require('../csAddon/dist/csAddon.node');

4.2. Creare una funzione di test

Aggiungere questa funzione in un punto qualsiasi del file (dopo le istruzioni require):

const callPhiSilica = async () => {
  console.log('Summarizing with Phi Silica: ')
  const result = await csAddon.Addon.summarizeText("The Windows App Development CLI is a powerful tool that bridges cross-platform development with Windows-native capabilities.");
  console.log('Summary:', result);
};

4.3. Chiamare la funzione

Aggiungere questa riga alla fine della createWindow() funzione per testare l'API all'avvio dell'app:

callPhiSilica();

Quando si esegue l'app, il riepilogo verrà stampato nella console. Da qui puoi integrare il componente aggiuntivo nella tua app nel modo che preferisci: esponendolo attraverso uno script di precaricamento al processo del renderer, chiamandolo dai gestori IPC o utilizzandolo direttamente nel processo principale.

Passaggio 5: Aggiungere la funzionalità necessaria

Prima di poter usare l'API Phi Silica, devi dichiarare la funzionalità necessaria nel manifesto dell'app. Aprire Package.appxmanifest e aggiungere la systemAIModels funzionalità all'interno della <Capabilities> sezione:

<Capabilities>
  <rescap:Capability Name="runFullTrust" />
  <rescap:Capability Name="systemAIModels" />
</Capabilities>

Passaggio 6: Aggiornare l'identità del debug

Ogni volta che modifichi Package.appxmanifest o modifichi gli asset a cui si fa riferimento nel manifesto (ad esempio le icone dell'app), devi aggiornare l'identità di debug dell'app. Corri!

npx winapp node add-electron-debug-identity

Questo comando:

1. Legge il tuo Package.appxmanifest per ottenere i dettagli e le funzionalità dell'app
2. Registra electron.exe nel node_modules con un'identità temporanea.
3. Consente di testare le API necessarie per l'identità senza pacchetti MSIX completi

Ora esegui l'applicazione:

npm start

Controlla l'output della console - dovresti vedere visualizzato il riepilogo di Phi Silica!

Operazioni successive

Complimenti. Hai creato con successo un componente aggiuntivo nativo che chiama le API di Windows per l'intelligenza artificiale! 🎉

A questo momento è possibile:

• Creare un pacchetto dell'app per la distribuzione : creare un pacchetto MSIX che è possibile distribuire

In alternativa, esplorare altre guide:

• Creazione di un componente aggiuntivo WinML - Scopri come utilizzare Windows Machine Learning
• Panoramica introduttiva - Tornare alla guida principale

Risorse aggiuntive

• Documentazione dell'interfaccia della riga di comando di winapp - Informazioni di riferimento complete dell'interfaccia della riga di comando
• Esempio di app Electron - Esempio di lavoro completo
• Windows AI Addon per Electron - L'addon Windows AI per Electron è un componente aggiuntivo nativo di Node.js che fornisce l'accesso alle Windows AI APIs direttamente da JavaScript.
• AI Dev Gallery - Raccolta di esempi di tutte le API di intelligenza artificiale
• SDK per app di Windows Samples - Raccolta di esempi di SDK per app di Windows
• node-api-dotnet - Libreria di interoperabilità JavaScript C# ↔