Chrome 擴充功能開發

### 程式碼風格與結構 - 編寫清晰、模組化的 TypeScript 程式碼,具有適當的型別定義 - 遵循函數式程式設計模式;避免使用類別 - 使用描述性變數名稱(例如:isLoading、hasPermission) - 按邏輯組織檔案:popup、background、content scripts、utils - 實現適當的錯誤處理和日誌記錄 - 使用 JSDoc 註釋記錄程式碼 ### 架構與最佳實踐 - 嚴格遵循 Manifest V3 規範 - 合理分配 background、content scripts 和 popup 的職責 - 按照最小權限原則配置權限 - 使用現代建置工具(webpack/vite)進行開發 - 實現適當的版本控制和變更管理 ### Chrome API 使用 - 正確使用 chrome.* API(storage、tabs、runtime 等) - 使用 Promise 處理非同步操作 - 使用 Service Worker 作為背景指令碼(MV3 要求) - 使用 chrome.alarms 實現排程任務 - 使用 chrome.action API 處理瀏覽器操作 - 優雅處理離線功能 ### 安全與隱私 - 實施內容安全策略(CSP) - 安全處理使用者資料 - 預防 XSS 和注入攻擊 - 在元件之間使用安全的訊息傳遞 - 安全處理跨域請求 - 實現安全的資料加密 - 遵循 web_accessible_resources 最佳實踐 ### 效能與最佳化 - 最小化資源使用並避免記憶體洩漏 - 最佳化背景指令碼效能 - 實現適當的快取機制 - 高效處理非同步操作 - 監控和最佳化 CPU/記憶體使用 ### UI 與使用者體驗 - 遵循 Material Design 指南 - 實現響應式彈出視窗 - 提供清晰的使用者回饋 - 支援鍵盤導航 - 確保適當的載入狀態 - 新增適當的動畫效果 ### 國際化 - 使用 chrome.i18n API 進行翻譯 - 遵循 _locales 結構 - 支援 RTL 語言 - 處理區域格式 ### 無障礙性 - 實現 ARIA 標籤 - 確保足夠的顏色對比度 - 支援螢幕閱讀器 - 新增鍵盤快捷鍵 ### 測試與除錯 - 有效使用 Chrome DevTools - 編寫單元測試和整合測試 - 測試跨瀏覽器相容性 - 監控效能指標 - 處理錯誤場景 ### 發布與維護 - 準備商店清單和螢幕截圖 - 編寫清晰的隱私政策 - 實現更新機制 - 處理使用者回饋 - 維護文件 ### 遵循官方文件 - 參考 Chrome 擴充功能文件 - 關注 Manifest V3 變更 - 遵循 Chrome Web Store 指南 - 監控 Chrome 平台更新 ### 輸出期望 - 提供清晰、可工作的程式碼範例 - 包含必要的錯誤處理 - 遵循安全最佳實踐 - 確保跨瀏覽器相容性 - 編寫可維護和可擴展的程式碼