Simply Patrick Hopes can always go up, tears can only come down.

[dependencies]
wasm-bindgen = "0.2"           # JavaScript 互操作層
pulldown-cmark = "0.12"        # 經過實戰驗證的 Markdown 解析器
web-sys = "0.3"                # Web API 綁定
serde = { version = "1.0", features = ["derive"] }
serde-wasm-bindgen = "0.6"     # Rust/JS 之間的資料序列化
console_error_panic_hook = "0.1"  # 瀏覽器中更好的錯誤訊息

use wasm_bindgen::prelude::*;

// WASM 模組載入時自動執行
#[wasm_bindgen(start)]
pub fn init() {
    utils::set_panic_hook();  // 更好的錯誤訊息
}

// 簡單的字串轉換
#[wasm_bindgen]
pub fn markdown_to_html(markdown: &str) -> String {
    parser::parse_markdown(markdown)
}

// 複雜結構 → JavaScript 物件
#[wasm_bindgen]
pub fn get_statistics(text: &str) -> JsValue {
    let stats = parser::calculate_stats(text);
    serde_wasm_bindgen::to_value(&stats).unwrap()
}

use pulldown_cmark::{html, Options, Parser};

pub fn parse_markdown(markdown: &str) -> String {
    let mut options = Options::empty();
    options.insert(Options::ENABLE_STRIKETHROUGH);
    options.insert(Options::ENABLE_TABLES);
    options.insert(Options::ENABLE_FOOTNOTES);
    options.insert(Options::ENABLE_TASKLISTS);

    let parser = Parser::new_ext(markdown, options);
    let mut html_output = String::new();
    html::push_html(&mut html_output, parser);
    html_output
}

#[derive(Serialize)]
pub struct Statistics {
    pub characters: usize,
    pub characters_no_spaces: usize,
    pub words: usize,
    pub lines: usize,
    pub paragraphs: usize,
    pub reading_time_minutes: f64,
}

pub fn calculate_stats(text: &str) -> Statistics {
    let words = text.split_whitespace().count();
    let paragraphs = text
        .split("\n\n")
        .filter(|s| !s.trim().is_empty())
        .count();
    // 平均閱讀速度：每分鐘 200 字
    let reading_time_minutes = (words as f64 / 200.0).ceil();
    // ...
}

import init, {
    markdown_to_html,
    get_statistics
} from '../pkg/wasm_markdown_editor.js';

async function run() {
    // 初始化 WASM 模組
    await init();

    // 現在可以使用 Rust 函式了
    const html = markdown_to_html(markdown);
    const stats = get_statistics(text);
}

// 效能優化：防抖動
let debounceTimer = null;
const DEBOUNCE_DELAY = 300;

function handleInput() {
    if (debounceTimer) clearTimeout(debounceTimer);

    updateStatistics();  // 立即更新（快速）

    debounceTimer = setTimeout(() => {
        updatePreview();   // 防抖動（較重）
        saveToStorage();
    }, DEBOUNCE_DELAY);
}

# 安裝 wasm-pack（只需一次）
cargo install wasm-pack

# 建置 WASM 模組
wasm-pack build --target web

# 執行 Rust 單元測試
cargo test

# 在瀏覽器中執行 WASM 測試
wasm-pack test --headless --firefox

[lib]
crate-type = ["cdylib", "rlib"]  # WASM 編譯必需

[profile.release]
opt-level = "s"    # 優化檔案大小（而非速度）
lto = true         # 連結時優化，產生更小的套件

# 從專案根目錄提供服務，而非 www/
cd wasm-markdown-editor
python -m http.server 8080

# 存取 http://localhost:8080

{
  "peacock.favoriteColors": [
    {"name":"Airbnb Pink","value":"#ff385c"},
    {"name":"Amazon Orange","value":"#ff9900"},
    {"name":"AMD Red","value":"#ed1c24"},
    {"name":"Angular Red","value":"#dd0531"},
    {"name":"Apple Gray","value":"#555555"},
    {"name":"AWS Orange","value":"#ff9900"},
    {"name":"Azure Blue","value":"#007fff"},
    {"name":"Babel Yellow","value":"#f9dc3e"},
    {"name":"Bootstrap Purple","value":"#7952b3"},
    {"name":"C++ Blue","value":"#00599c"},
    {"name":"C# Purple","value":"#239120"},
    {"name":"Clojure Green","value":"#5881d8"},
    {"name":"Deno Green","value":"#00a853"},
    {"name":"Django Green","value":"#092e20"},
    {"name":"Docker Blue","value":"#2496ed"},
    {"name":"Electron Blue","value":"#47848f"},
    {"name":"Elixir Purple","value":"#6f42be"},
    {"name":"ESLint Purple","value":"#4b32c3"},
    {"name":"Facebook Blue","value":"#1877f2"},
    {"name":"Fastify Blue","value":"#000000"},
    {"name":"Firebase Orange","value":"#ffa400"},
    {"name":"GitHub Green","value":"#08872b"},
    {"name":"Go Cyan","value":"#00add8"},
    {"name":"Google Blue","value":"#4285f4"},
    {"name":"GraphQL Pink","value":"#e10098"},
    {"name":"Haskell Purple","value":"#5e5086"},
    {"name":"Instagram Pink","value":"#e4405f"},
    {"name":"Intel Blue","value":"#0071c5"},
    {"name":"Java Orange","value":"#007396"},
    {"name":"JavaScript Yellow","value":"#f9e64f"},
    {"name":"Jest Red","value":"#c21325"},
    {"name":"Kotlin Purple","value":"#7f52ff"},
    {"name":"Kubernetes Blue","value":"#326ce5"},
    {"name":"Laravel Red","value":"#ff2d20"},
    {"name":"LinkedIn Blue","value":"#0a66c2"},
    {"name":"Lua Blue","value":"#000080"},
    {"name":"Mandalorian Blue","value":"#1857a4"},
    {"name":"MATLAB Orange","value":"#0071c5"},
    {"name":"Meta Blue","value":"#1877f2"},
    {"name":"Microsoft Blue","value":"#0078d4"},
    {"name":"MongoDB Green","value":"#13aa52"},
    {"name":"NestJS Red","value":"#ea2845"},
    {"name":"Netflix Red","value":"#e50914"},
    {"name":"Node Green","value":"#215732"},
    {"name":"Node.js Green","value":"#68a063"},
    {"name":"npm Red","value":"#cb3837"},
    {"name":"Nuxt Green","value":"#00dc82"},
    {"name":"Nvidia Green","value":"#76b900"},
    {"name":"Perl Blue","value":"#0073a1"},
    {"name":"PHP Purple","value":"#777bb4"},
    {"name":"PostgreSQL Blue","value":"#336791"},
    {"name":"Python Blue","value":"#3776ab"},
    {"name":"R Blue","value":"#276dc3"},
    {"name":"React Blue","value":"#61dafb"},
    {"name":"Redis Red","value":"#dc382d"},
    {"name":"Ruby Red","value":"#cc342d"},
    {"name":"Rust Orange","value":"#ce422b"},
    {"name":"Scala Red","value":"#dc322f"},
    {"name":"Slack Purple","value":"#e01e5a"},
    {"name":"Something Different","value":"#832561"},
    {"name":"Spotify Green","value":"#1db954"},
    {"name":"Spring Green","value":"#6db33f"},
    {"name":"Svelte Orange","value":"#ff3d00"},
    {"name":"Swift Orange","value":"#fa7343"},
    {"name":"Tailwind Cyan","value":"#06b6d4"},
    {"name":"Tesla Red","value":"#e82127"},
    {"name":"Twitter Blue","value":"#1da1f2"},
    {"name":"TypeScript Blue","value":"#3178c6"},
    {"name":"Uber Black","value":"#000000"},
    {"name":"Vue Green","value":"#42b883"},
    {"name":"Webpack Blue","value":"#8dd6f9"},
    {"name":"WhatsApp Green","value":"#25d366"},
    {"name":"Yarn Blue","value":"#2c8ebb"}
  ]
}

// 私有模組 - 隱藏內部實作細節
mod job;
mod storage;
mod worker;

// 公開重匯出 - 只暴露需要的類型
pub use job::{Job, JobHandler, JobStatus, Priority};
pub use storage::{Storage, StorageError};
pub use worker::WorkerPool;

pub mod job;  // 暴露整個模組，使用者可存取所有公開項目

pub trait JobHandler: Send + Sync {
    fn handle(&self, payload: &[u8]) -> Result<(), String>;
}

struct EchoHandler;

impl JobHandler for EchoHandler {
    fn handle(&self, payload: &[u8]) -> Result<(), String> {
        let message = String::from_utf8_lossy(payload);
        println!("處理任務：{}", message);
        Ok(())
    }
}

pub struct Job {
    pub payload: Vec<u8>,
    // ...
}

pub struct JobPayload(Vec<u8>);

impl JobPayload {
    pub fn new(bytes: Vec<u8>) -> Self {
        Self(bytes)
    }
    
    pub fn as_bytes(&self) -> &[u8] {
        &self.0
    }
}

impl From<String> for JobPayload {
    fn from(s: String) -> Self {
        Self(s.into_bytes())
    }
}

impl fmt::Display for Priority {
    fn fmt(&self, f: &mut fmt::Formatter<'_>) -> fmt::Result {
        match self {
            Priority::Low => write!(f, "low"),
            Priority::Normal => write!(f, "normal"),
            Priority::High => write!(f, "high"),
            Priority::Critical => write!(f, "critical"),
        }
    }
}

use strum_macros::Display;

#[derive(Display)]
#[strum(serialize_all = "lowercase")]
pub enum Priority {
    Low,
    Normal,
    High,
    Critical,
}

#[tokio::main]
async fn main() -> Result<(), Box<dyn std::error::Error>> {
    // ...
}

for worker_id in 0..self.num_workers {
    let handle = tokio::spawn(async move {
        worker_loop(worker_id, storage, handler, poll_interval).await;
    });
    handles.push(handle);
}

sleep(poll_interval).await;  // 輪詢間隔

pub struct Storage {
    conn: Arc<Mutex<Connection>>,  // ✅ std::sync::Mutex
}

pub fn get_next_pending(&self) -> Result<Option<Job>, StorageError> {
    let conn = self.conn.lock().unwrap();
    // 執行快速的同步資料庫操作
    // 沒有在持鎖期間 await
    Ok(job)
}

// ❌ 錯誤：在持有 std::sync::Mutex 時 await
let guard = std_mutex.lock().unwrap();
async_operation().await;  // 會阻塞整個執行緒！

// ✅ 正確：使用 tokio::sync::Mutex
let guard = tokio_mutex.lock().await;
async_operation().await;  // OK，會讓出執行權

// ❌ 有競爭條件的程式碼
pub fn get_next_pending(&self) -> Result<Option<Job>, StorageError> {
    // 步驟 1：讀取待處理任務
    let job = SELECT ... WHERE status = Pending LIMIT 1;
    // ⚠️ 問題：Worker 2 可能在這裡也讀取到相同任務！
    Ok(job)
}

// Worker 處理邏輯
let job = storage.get_next_pending()?;  // 取得任務
job.mark_running();                     // 標記為執行中
storage.update(&job)?;                  // 更新資料庫

pub fn get_next_pending(&self) -> Result<Option<Job>, StorageError> {
    let conn = self.conn.lock().unwrap();
    
    // ✅ 原子性的 UPDATE + RETURNING（一個 SQL 語句完成）
    let mut stmt = conn.prepare(
        "UPDATE jobs
         SET status = ?1, updated_at = ?2
         WHERE id = (
             SELECT id FROM jobs
             WHERE status = ?3
             ORDER BY priority DESC, created_at ASC
             LIMIT 1
         )
         RETURNING id, payload, priority, status, retry_count, max_retries,
                   created_at, updated_at, error_message",
    )?;

    let now = Utc::now().to_rfc3339();
    let job = stmt
        .query_row(
            params![JobStatus::Running as i32, now, JobStatus::Pending as i32],
            |row| Ok(self.row_to_job(row)?),
        )
        .optional()?;

    Ok(job)
}

// ✅ 修正後
match storage.get_next_pending() {
    Ok(Some(mut job)) => {
        // 任務已經是 Running 狀態，直接處理
        match handler.handle(&job.payload) {
            Ok(()) => job.mark_completed(),
            Err(e) => job.mark_failed(e),
        }
        storage.update(&job)?;
    }
    Ok(None) => {
        sleep(poll_interval).await;  // 無任務，等待
    }
    Err(e) => { /* 處理錯誤 */ }
}

// ✅ 使用者導向的輸出
println!("Job ID: {}", job.id);
println!("Status: {}", job.status);

// ✅ 操作性日誌、除錯資訊
tracing::info!(job_id = %job.id, "Processing job");
tracing::error!("Database error: {}", e);

#[tokio::main]
async fn main() -> Result<(), Box<dyn std::error::Error>> {
    // 設定日誌格式與過濾級別
    tracing_subscriber::fmt()
        .with_env_filter(
            tracing_subscriber::EnvFilter::from_default_env()
                .add_directive(tracing::Level::INFO.into()),
        )
        .init();
    
    // ...
}

# 預設 INFO 級別
./worker

# 設定為 DEBUG 級別
RUST_LOG=debug ./worker

CREATE TABLE jobs (
    id TEXT PRIMARY KEY,
    payload BLOB NOT NULL,
    priority INTEGER NOT NULL,
    status INTEGER NOT NULL,
    retry_count INTEGER NOT NULL,
    max_retries INTEGER NOT NULL,
    created_at TEXT NOT NULL,
    updated_at TEXT NOT NULL,
    error_message TEXT
);

CREATE INDEX idx_status_priority
ON jobs(status, priority DESC, created_at ASC);

pub fn mark_failed(&mut self, error: String) {
    self.status = if self.can_retry() {
        self.retry_count += 1;
        JobStatus::Pending  // 重新排程
    } else {
        JobStatus::DeadLetter  // 移至死信佇列
    };
    self.error_message = Some(error);
    self.updated_at = Utc::now();
}

# 提交任務
producer submit -p "Hello, World!" -r high -m 3

# 查詢狀態
producer status --job-id <uuid>

# 統計資料
producer stats

#[derive(Parser)]
#[command(name = "producer")]
#[command(about = "Job queue producer - submit and manage jobs")]
struct Cli {
    #[arg(short, long, default_value = "jobs.db")]
    database: String,

    #[command(subcommand)]
    command: Commands,
}

#[derive(Subcommand)]
enum Commands {
    Submit {
        #[arg(short, long)]
        payload: String,
        
        #[arg(short = 'r', long, default_value = "normal")]
        priority: String,
        
        #[arg(short, long, default_value = "3")]
        max_retries: u32,
    },
    Status { /* ... */ },
    Stats,
}

# 啟動 4 個 workers
worker -w 4

# 使用不同的資料庫
worker --database /path/to/jobs.db --workers 8

loop {
    match storage.get_next_pending() {
        Ok(Some(job)) => { /* 處理 */ }
        Ok(None) => sleep(poll_interval).await,  // 等待 1 秒
        Err(e) => { /* 錯誤處理 */ }
    }
}

// 生產者插入任務後通知
notifier.notify_waiters();

// Worker 等待通知
notifier.notified().await;

if job.retry_count > 0 {
    let backoff = Duration::from_secs(2_u64.pow(job.retry_count.min(5)));
    sleep(backoff).await;
}