WebAssembly (WASM) for High Performance Apps · Aula

Tratamento de erros além da fronteira do WASM

Trate corretamente Results, Options e pânicos do Rust quando atravessarem para JavaScript usando wasm-bindgen.

Aula 4 de 413 etapas

Tratamento de erros além da fronteira do WASM é uma aula grátis de WebAssembly (WASM) for High Performance Apps no CoddyKit. Esta é a aula 4 de 4. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de WebAssembly (WASM) for High Performance Apps, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de WebAssembly (WASM) for High Performance Apps inclui 4 aulas no total.

Partes desta aula ainda não foram traduzidas e aparecem em inglês.

Errors Need a Bridge

Rust uses Result and Option for errors; JavaScript uses exceptions and null/undefined.

wasm-bindgen bridges these two worlds so failures surface naturally on each side.

Returning Result to JS

A Rust function returning Result<T, JsValue> becomes a JS function that either returns the value or throws.

use wasm_bindgen::prelude::*;

#[wasm_bindgen]
pub fn parse(input: &str) -> Result<i32, JsValue> {
    input.parse::<i32>()
        .map_err(|e| JsValue::from_str(&e.to_string()))
}

Catching It in JavaScript

On the JS side, an Err arrives as a thrown exception, so wrap calls in try/catch.

try {
  const n = parse('abc');
} catch (e) {
  console.error('Parse failed:', e);
}

Mapping Custom Errors

Convert your own error types into a JsValue so JS gets a useful message. The ? operator plus map_err keeps this clean.

#[wasm_bindgen]
pub fn divide(a: i32, b: i32) -> Result<i32, JsValue> {
    if b == 0 {
        return Err(JsValue::from_str('division by zero'));
    }
    Ok(a / b)
}

Returning Option

Rust's Option<T> maps to a value or undefined in JS, perfect for nullable results.

#[wasm_bindgen]
pub fn first_char(s: &str) -> Option<char> {
    s.chars().next()
}

What Happens on Panic

A Rust panic in WASM aborts the module and is hard to debug, by default you get an unhelpful 'unreachable' error.

Panics should be rare; prefer Result for expected failures.

Better Panic Messages

The console_error_panic_hook crate forwards panic messages to the browser console, making debugging far easier.

#[wasm_bindgen(start)]
pub fn main() {
    console_error_panic_hook::set_once();
}

Result vs Panic

Choose deliberately:

  • Result, expected, recoverable errors (bad input, not found)
  • Panic, programmer bugs and invariants that should never break

Never use panics for normal control flow across the boundary.

Using a Custom Error Type

For richer errors, define a struct exported to JS, so JS can read fields instead of just a string.

#[wasm_bindgen]
pub struct AppError { pub code: i32 }

#[wasm_bindgen]
impl AppError {
    #[wasm_bindgen(getter)]
    pub fn code(&self) -> i32 { self.code }
}

Propagating with ?

Inside a function returning Result<_, JsValue>, the ? operator propagates errors cleanly when types convert.

#[wasm_bindgen]
pub fn run(input: &str) -> Result<i32, JsValue> {
    let n: i32 = input.parse().map_err(|_| JsValue::from_str('bad'))?;
    Ok(n * 2)
}

Best Practices Summary

For robust error handling:

  • Return Result<T, JsValue> so errors become JS exceptions
  • Return Option for nullable values
  • Install console_error_panic_hook for debuggable panics
  • Reserve panics for true bugs, use Result for expected failures

Quick Check

How does a Rust function returning Result<T, JsValue> behave when it returns Err and is called from JavaScript?

Recap

You now handle errors cleanly across the boundary:

  • Result becomes a JS throw; Option becomes value-or-undefined
  • Map custom errors into JsValue
  • Use console_error_panic_hook to debug panics
  • Prefer Result over panic for expected failures

Clear error semantics make Rust+WASM libraries pleasant and safe to consume from JS.

Grátis para começar

Aprenda WebAssembly (WASM) for High Performance Apps com um tutor de IA — grátis

Escreva e execute código real no seu navegador, obtenha ajuda instantânea de um tutor de IA 24/7 e continue de onde parou na web ou no app.

Cursos
12
Aulas
48

Perguntas Frequentes

A aula “Tratamento de erros além da fronteira do WASM” é grátis?

Sim — o texto completo de “Tratamento de erros além da fronteira do WASM” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de WebAssembly (WASM) for High Performance Apps, atualize para CoddyKit PRO. O curso de WebAssembly (WASM) for High Performance Apps inclui 4 aulas no total.

O que vou aprender em “Tratamento de erros além da fronteira do WASM”?

Trate corretamente Results, Options e pânicos do Rust quando atravessarem para JavaScript usando wasm-bindgen. Você pratica WebAssembly (WASM) for High Performance Apps com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.

Preciso ter experiência prévia para começar WebAssembly (WASM) for High Performance Apps?

Nenhuma experiência prévia é necessária. WebAssembly (WASM) for High Performance Apps no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 4 de 4.

Quanto tempo leva a aula “Tratamento de erros além da fronteira do WASM”?

A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.

Posso escrever e executar código nesta aula de WebAssembly (WASM) for High Performance Apps?

Sim. Cada aula de WebAssembly (WASM) for High Performance Apps inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.

Todas as aulas deste curso

  1. Configurando Rust para WebAssembly
  2. Escrevendo funções Rust para WASM
  3. Integração eficiente entre JS e WASM com `wasm-bindgen`
  4. Tratamento de erros além da fronteira do WASM
← Voltar para WebAssembly (WASM) for High Performance Apps