Membuat addon WinML untuk Electron

Panduan ini menunjukkan cara membuat addon asli C# yang menggunakan Windows Machine Learning (WinML) di aplikasi Electron Anda. WinML memungkinkan Anda menjalankan model machine learning (format ONNX) secara lokal di perangkat Windows untuk tugas seperti klasifikasi gambar, deteksi objek, dan banyak lagi.

Prasyarat

Nota

WinML berjalan pada perangkat Windows 10 (1809+) atau Windows 11 apa pun. Untuk performa terbaik, perangkat dengan GPU atau NPU disarankan, tetapi API juga berfungsi pada CPU.

Langkah 1: Membuat addon asli C#

npx winapp node create-addon --template cs --name winMlAddon

Ini akan menghasilkan folder winMlAddon/ dengan proyek C# yang telah dikonfigurasi menggunakan referensi Windows SDK dan Windows App SDK.

Bangun addon:

npm run build-winMlAddon

Langkah 2: Unduh model SqueezeNet

  1. Menginstal AI Dev Gallery
  2. Menavigasi ke sampel Gambar Klasifikasi
  3. Unduh model SqueezeNet 1.1
  4. Salin file ke folder />

Nota

Model ini juga dapat diunduh dari repo GitHub ONNX Model Zoo.

Langkah 3: Tambahkan paket NuGet yang diperlukan

Perbarui Directory.packages.props di root proyek Anda:

<PackageVersion Include="Microsoft.ML.OnnxRuntime.Extensions" Version="0.14.0" />
<PackageVersion Include="System.Drawing.Common" Version="9.0.9" />

Perbarui winMlAddon/winMlAddon.csproj untuk menambahkan referensi paket:

<PackageReference Include="Microsoft.ML.OnnxRuntime.Extensions" />
<PackageReference Include="System.Drawing.Common" />

Langkah 4: Tambahkan kode sampel

AI Dev Gallery menyediakan implementasi lengkap untuk klasifikasi gambar dengan SqueezeNet. Anda dapat menemukan kode yang disesuaikan dalam sampel electron-winml.

winMlAddon/ Salin folder dari sampel, atau perbarui winMlAddon/addon.cs secara manual dengan kode sampel.

Detail implementasi utama

Jalur root proyek: Addon memerlukan kode JavaScript untuk memberikan jalur root proyek agar dapat menemukan model ONNX dan dependensi asli.

Pramuat dependensi asli: Addon ini menyertakan metode untuk memuat DLL yang diperlukan, yang bekerja baik dalam skenario pengembangan maupun produksi.

Konfigurasi Electron Forge: Mengonfigurasi packager Anda untuk membuka kemasan file asli:

module.exports = {
  packagerConfig: {
    asar: {
      unpack: "**/*.{dll,exe,node,onnx}"
    },
    ignore: [
      /^\/.winapp\//,
      "\\.msix$",
      /^\/winMlAddon\/(?!dist).+/
    ]
  },
};

Langkah 5: Bangun addon

npm run build-winMlAddon

Langkah 6: Uji addon

Buka src/index.js dan muat addon:

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

Tambahkan fungsi pengujian:

const testWinML = async () => {
  try {
    let projectRoot = path.join(__dirname, '..');
    if (projectRoot.includes('app.asar')) {
      projectRoot = projectRoot.replace('app.asar', 'app.asar.unpacked');
    }

    const addon = await winMlAddon.Addon.createAsync(projectRoot);
    console.log('Model loaded successfully!');

    const imagePath = path.join(projectRoot, 'test-images', 'sample.jpg');
    const predictions = await addon.classifyImage(imagePath);

    console.log('Top predictions:');
    predictions.slice(0, 5).forEach((pred, i) => {
      console.log(`${i + 1}. ${pred.label}: ${(pred.confidence * 100).toFixed(2)}%`);
    });
  } catch (error) {
    console.error('Error testing WinML:', error.message);
  }
};

Siapkan gambar pengujian dengan membuat test-images/ folder dengan gambar sampel, lalu jalankan:

npm start

Langkah 7: Memperbarui identitas debug

npx winapp node add-electron-debug-identity

Nota

Ada bug Windows yang telah diketahui dengan pengemasan jarang pada aplikasi Electron yang dapat menyebabkan crash atau menyebabkan jendela kosong. Lihat panduan penyiapan untuk solusinya.

Langkah berikutnya

  • Last updated on