LiteRT สำหรับเว็บด้วย LiteRT.js

LiteRT.js คือรันไทม์ WebAI ประสิทธิภาพสูงของ Google ซึ่งมุ่งเป้าไปที่เว็บแอปพลิเคชันที่ใช้งานจริง โดยเป็นส่วนขยายของสแต็ก LiteRT ซึ่งช่วยให้มั่นใจได้ถึงการรองรับ เฟรมเวิร์กหลายรายการและรวมรันไทม์หลักของเราไว้ในแพตฟอร์มทั้งหมด

LiteRT.js รองรับฟีเจอร์หลักต่อไปนี้

1. การอนุมานที่เร่งด้วยฮาร์ดแวร์ในเบราว์เซอร์: เรียกใช้โมเดลด้วยประสิทธิภาพ CPU ที่ยอดเยี่ยม ซึ่งเร่งความเร็วด้วย XNNPack ที่แมปกับ WebAssembly (Wasm) แบบน้ำหนักเบา สำหรับ GPU และการปรับขนาดฮาร์ดแวร์เฉพาะ (เช่น NPU) LiteRT.js จะแสดงทั้ง WebGPU API และ WebNN API ที่กำลังมาแรง โดยกำเนิด ซึ่งช่วยให้การเพิ่มประสิทธิภาพเฉพาะแพลตฟอร์มมีความละเอียดมากขึ้น
2. ความเข้ากันได้กับเฟรมเวิร์กหลายรายการ: ปรับปรุงความหมายของการพัฒนาให้มีประสิทธิภาพมากขึ้นด้วยการคอมไพล์จากเฟรมเวิร์ก ML ที่คุณต้องการโดยกำเนิด ได้แก่ PyTorch, JAX หรือ TensorFlow
3. ทำซ้ำในไปป์ไลน์ที่มีอยู่: การผสานรวมกับสถาปัตยกรรม TensorFlow.js ที่มีอยู่โดยไม่ต้องกำหนดค่าเพิ่มเติมด้วยการแยกวิเคราะห์ Tensor TensorFlow.js ที่รองรับโดยกำเนิด เป็นอินพุตและเอาต์พุตขอบเขตโดยตรง

การติดตั้ง

ติดตั้งแพ็กเกจ @litertjs/core จาก npm โดยใช้คำสั่งต่อไปนี้

npm install @litertjs/core

ไฟล์ Wasm จะอยู่ใน node_modules/@litertjs/core/wasm/ คัดลอกและแสดงโฟลเดอร์ wasm/ ทั้งหมดเพื่อความสะดวก จากนั้นนำเข้าแพ็กเกจและโหลดไฟล์ Wasm โดยใช้คำสั่งต่อไปนี้

import {loadLiteRt} from '@litertjs/core';

// Load the LiteRT.js Wasm files from a CDN.
await loadLiteRt('https://cdn.jsdelivr.net/npm/@litertjs/core/wasm/')
// Alternatively, host them from your server.
// They are located in node_modules/@litertjs/core/wasm/
await loadLiteRt(`your/path/to/wasm/`);

การแปลงโมเดล

LiteRT.js ใช้รูปแบบ .tflite เดียวกันกับระบบนิเวศ LiteRT อื่นๆ และรองรับโมเดลที่มีอยู่ใน Kaggle และ Huggingface หากคุณมีโมเดล PyTorch ใหม่ คุณจะต้องแปลงโมเดลดังกล่าว

แปลงโมเดล PyTorch เป็น LiteRT

หากต้องการแปลงโมเดล PyTorch เป็น LiteRT ให้ใช้ตัวแปลง litert-torch

import litert_torch

# Load your torch model. We're using resnet for this example.
resnet18 = torchvision.models.resnet18(torchvision.models.ResNet18_Weights.IMAGENET1K_V1)

sample_inputs = (torch.randn(1, 3, 224, 224),)

# Convert the model to LiteRT.
edge_model = litert_torch.convert(resnet18.eval(), sample_inputs)

# Export the model.
edge_model.export('resnet.tflite')

เรียกใช้โมเดลที่แปลงแล้ว

หลังจากแปลงโมเดลเป็นไฟล์ .tflite แล้ว คุณจะดำเนินการในเบราว์เซอร์ได้

import {loadAndCompile} from '@litertjs/core';

// Load the model hosted from your server. This makes an http(s) request.
const model = await loadAndCompile('/path/to/model.tflite', {
    accelerator: 'webgpu',
    // Can select from 'webnn', 'webgpu', & 'wasm'.
    // Additionally, you can pass an array of accelerators e.g. ['webnn', 'wasm']
    // if you would like to fallback to CPU execution,
    // Note that ONLY cpu fallback is supported for now
    // (i.e. specifying ['webnn', 'webgpu']) will lead to compilation errors
});
// The model can also be loaded from a Uint8Array if you want to fetch it yourself.

// Create image input data
const image = new Float32Array(224 * 224 * 3).fill(0);
const inputTensor = new Tensor(image, /* shape */ [1, 3, 224, 224]);

// Run the model
const outputs = await model.run(inputTensor);
// You can also use `await model.run([inputTensor]);`
// or `await model.run({'input_tensor_name': inputTensor});`

// Clean up and get outputs
inputTensor.delete();
const output = outputs[0];
const outputData = await output.data();
output.delete();

ผสานรวมกับไปป์ไลน์ TensorFlow.js ที่มีอยู่

คุณควรพิจารณาผสานรวม LiteRT.js เข้ากับ TensorFlow.js ด้วยเหตุผลต่อไปนี้

1. ประสิทธิภาพ GPU และฮาร์ดแวร์ที่ยอดเยี่ยม: โมเดล LiteRT.js ใช้ประโยชน์จากการเร่งความเร็ว WebGPU เพื่อประสิทธิภาพที่เพิ่มประสิทธิภาพในสถาปัตยกรรมเบราว์เซอร์ LiteRT.js รองรับ WebGPU และ WebNN ที่กำลังจะมาถึง จึงมีการเร่งความเร็วฮาร์ดแวร์ที่ยืดหยุ่นในอุปกรณ์ Edge ที่หลากหลาย
2. เส้นทาง Conversion โมเดลที่ง่ายขึ้น: เส้นทาง Conversion LiteRT.js จะไป จาก PyTorch ไปยัง LiteRT โดยตรง เส้นทางการแปลงจาก PyTorch เป็น TensorFlow.js มีความซับซ้อนมากกว่ามาก โดยคุณจะต้องไปจาก PyTorch -> ONNX -> TensorFlow -> TensorFlow.js
3. เครื่องมือแก้ไขข้อบกพร่อง: เส้นทาง Conversion ของ LiteRT.js มาพร้อมกับ เครื่องมือแก้ไขข้อบกพร่อง

LiteRT.js ได้รับการออกแบบมาให้ทำงานภายในไปป์ไลน์ TensorFlow.js และเข้ากันได้กับการประมวลผลล่วงหน้าและภายหลังการประมวลผลของ TensorFlow.js ดังนั้นสิ่งเดียวที่คุณต้องย้ายข้อมูลคือตัวโมเดลเอง

ผสานรวม LiteRT.js เข้ากับไปป์ไลน์ TensorFlow.js โดยทำตามขั้นตอนต่อไปนี้

1. แปลงโมเดล TensorFlow, JAX หรือ PyTorch เดิมเป็น .tflite ดูรายละเอียดได้ที่ส่วนการแปลง โมเดล
2. ติดตั้งแพ็กเกจ @litertjs/core และ @litertjs/tfjs-interop NPM
3. นำเข้าและใช้แบ็กเอนด์ TensorFlow.js WebGPU ซึ่งจำเป็นเพื่อให้ LiteRT.js ทำงานร่วมกับ TensorFlow.js ได้
4. แทนที่ การโหลดโมเดล TensorFlow.js ด้วย การโหลด โมเดล LiteRT.js
5. แทนที่ TensorFlow.js model.predict(inputs) หรือ model.execute(inputs) ด้วย runWithTfjsTensors(liteRtModel, inputs) runWithTfjsTensors จะใช้ Tensor อินพุตเดียวกันกับที่โมเดล TensorFlow.js ใช้และแสดงผล Tensor TensorFlow.js
6. ทดสอบว่าไปป์ไลน์โมเดลแสดงผลลัพธ์ตามที่คุณคาดไว้

การใช้ LiteRT.js กับ runWithTfjsTensors อาจต้องมีการเปลี่ยนแปลงอินพุตของโมเดลต่อไปนี้ด้วย

1. จัดลำดับอินพุตใหม่: คุณอาจต้องเปลี่ยนลำดับอินพุตเมื่อส่งอินพุตเข้าไป ทั้งนี้ขึ้นอยู่กับวิธีที่ตัวแปลงจัดลำดับอินพุตและเอาต์พุตของโมเดล
2. สลับอินพุต: ตัวแปลงอาจเปลี่ยนเลย์เอาต์ของอินพุตและเอาต์พุตของโมเดลเมื่อเทียบกับสิ่งที่ TensorFlow.js ใช้ คุณอาจต้อง สลับอินพุตเพื่อให้ ตรงกับโมเดลและเอาต์พุตเพื่อให้ตรงกับไปป์ไลน์ที่เหลือ
3. เปลี่ยนชื่ออินพุต: หากคุณใช้ชื่ออินพุต ชื่ออาจมีการเปลี่ยนแปลงด้วย

คุณดูข้อมูลเพิ่มเติมเกี่ยวกับอินพุตและเอาต์พุตของโมเดลได้ด้วย model.getInputDetails() และ model.getOutputDetails()