---
# System prepended metadata

title: 'Serverless, WebAssembly (Wasm) - 莊翔任(Sean)'
tags: [A 會議室, HelloWorld2025, AI 如何改變產品規劃與需求定義, '2025', HWDC2025]

---

---
GA: UA-34467841-15
---

# Serverless, WebAssembly (Wasm) - 莊翔任(Sean)

###### tags: `HelloWorld2025` `HWDC2025` `2025` `A 會議室` `AI 如何改變產品規劃與需求定義`

<blockquote>
在 AI 日益強調即時性、隱私與低功耗的時代，Edge AI 成為許多企業與開發者的重要佈局。然而模型部署仍面臨平台相容性、執行效能與資源限制等挑戰。本演講將分享如何透過 WebAssembly（Wasm）技術，實現高可攜、可離線運行的 AI 推論模組，並介紹在 MediaPipe + Gemini Nano + WebAssembly 架構下的實測經驗。

本次深入探討 AI 模型如何轉換為適合瀏覽器的輕量型格式，結合向量資料庫與 SLM（Small Language Models）進行本地推論。歡迎對 AI 輕量部署、Web 技術與 Edge Intelligence 有興趣的開發者一同交流與討論。



聽眾收穫：

了解 WebAssembly 在 AI 模型本地推論上的應用場景與優勢
    
如何將 LLM/SLM 模型轉換並部署於瀏覽器與邊緣裝置

實際掌握 MediaPipe + Gemini Nano + Wasm 的整合技巧與潛在限制
    
掌握從雲端架構遷移至邊緣部署的技術挑戰與解決策略
</blockquote>

{%hackmd @HWDC/announcement-2025 %}

## 會議資訊

**時間：** 10:05 ~ 10:35  
**地點：** A 會議室  
**日期：** 2025年10月15日  
**語言：** 中文  
**難度：** 中階  

**相關連結：**
- [Hello World Dev Conference 2025 官方網站](https://hwdc.ithome.com.tw/2025) [target=_blank]
- [Hello World 2025 議程表](https://hwdc.ithome.com.tw/2025/agenda) [target=_blank]

## 筆記區

### Edge AI
資料不必上傳雲端 -> 提升隱私與安全性
可離線運作 -> 提升穩定度以及可靠性

#### 應用
- 手機影像辨識
- 智慧監控

### WebAssembly (wasm)

前端加速: 影像處理、影片編碼、3D 渲染、遊戲引擎
Edge AI 推論
跨平台運算： nodejs demo Iot

Example: Google Earth, Figma, Photoshop (on web)

### Edge AI & wasm

### Small Language Model (SLM)
參數較少(1億-100億)
推理速度快 延遲低
較易調整模型

Google MediaPipe - cross platform AI framework

### Edge AI Chatbot

### Integration
Question -> Edge AI -- if not good --> (Server) RAG -> LLM -> Answer
                    -- if good --> Answer

### AI memo

根據您的筆記內容，這是一個關於邊緣AI(Edge AI)與WebAssembly技術結合的完整技術分享。筆記涵蓋了以下主要內容：

**WebAssembly在AI應用中的優勢：**
- 提供接近原生的執行效能，適合處理AI推理的低延遲需求
- 在沙盒模式下運行，確保隱私和安全性
- 支援跨平台部署，包括瀏覽器端和IoT設備端
- 可以調用WebGL和設備CPU資源進行高效運算

**小語言模型(輕量化AI模型)的特點：**
- 參數量在1億到10億之間，相比大型模型(100億以上參數)更輕量
- 運算需求低，不需要昂貴的GPU硬體
- 部署成本低，適合中小企業使用
- 主流模型包括Phi系列、Llama3 8B系列等

**實作架構與測試結果：**
- 使用Google MediaPipe框架進行開發
- 建立了類似ChatGPT的Web應用，整合多個AI模型(Gemma2B、Phi2等)進行比較測試
- 本地端模型能力雖不如遠端API，但在特定場景下仍可提供基本回答
- 結合RAG技術處理內部文件，建立多層次的AI問答系統

**實際應用場景：**
- 在專案中將複雜的決策邏輯運算轉移到WebAssembly執行
- 使用微前端架構分離主線程與計算密集型任務
- 預先處理功能避免直接調用伺服器端資源

整體而言，這個技術方案展示了如何在瀏覽器端實現AI功能，兼顧效能、安全性和成本效益。

## 討論區

> 歡迎在此進行討論與 Q&A




## 相關資源

- 投影片連結：(待講者提供)
- 相關文件：(待更新)



