Skip to content

Latest commit

 

History

History
188 lines (114 loc) · 4.5 KB

webassembly.md

File metadata and controls

188 lines (114 loc) · 4.5 KB
theme transition title enableMenu enableSearch enableChalkboard slideNumber
league
slide
WebAssembly
true
false
true
true

WebAssembly

Como o WebAssembly permitiu Flutter e Python na Web

Níveis de Abstração

  • Átomos
  • Código de maquina (0 e 1)
  • Assembly

Grace Hopper

  • Flow-Matic → COBOL
  • Nascem as linguagens de baixo nível

Javascript

  • Foi feito para aplicações pequenas
  • É interpretado
  • Não é performático

Compilação

  • Tem um tempo maior para iniciar
  • Análise léxica do código
  • otimizações

JIT

  • Just in time compiler
  • Compilação com JS
  • Engine V8

-

Quente e Frio

  • “Temperatura do código”
  • Partes muito executadas → Quentes
  • Partes pouco executadas → Frias
  • Partes quentes → Candidatas a compilação

Show, entendi o JS, agora e esse tal de WASM?

O que é o WASM

Um novo tipo de código que pode ser executado em navegadores modernos e oferece novos recursos e grandes ganhos de desempenho.Ele não se destina principalmente a ser escrito à mão, mas foi projetado para ser um destino de compilação eficaz para linguagens de origem como C, C++, Rust, etc.

MDN

Quais problemas o WASM resolve

  • Melhor compatibilidade;
  • Mais segurança;
  • Maior desempenho em aplicações web;
  • Melhor acesso a recursos nativos.

Casos de uso

  • Edição de vídeo/imagem
  • Jogos
  • Reconhecimento de imagem
  • Aplicações CAD

Como funciona o processo

-

Exemplo (C++)

-

Exemplo (C++)

-

Vamos caminhar para nosso objetivo

Python na Web

PyScript

  • Houveram outras tentativas antes
  • transcrypt e Brython
  • Pyodide

Python é interpretado

Python é uma linguagem interpretada, que não vem com um compilador padrão que possa direcionar o WebAssembly. Então, como esse processo ocorre?

Resposta

-

E no caso do Flutter?

Flutter na web

  • DOM + Canvas + CSS → DomCanvas
  • Compila código Dart em JS → dart2js
  • Skia (O Skia é uma biblioteca de gráficos 2D)
  • Flutter 1.17 → CanvasKit → WebAssembly e WebGl.

Por que o Flutter não usa WebAssembly ao invés do dart2js?

WASM não pode acessar o DOM

Como assim?

  • Wasm é mais rápido que Js para coisas complexas
  • Mas o JS pode manipular o DOM

Outro problema

  • WASM não possui um garbage collector
  • WASM originalmente foi pensado como um target para C/C++

Luís Antônio (Tonhão)

  • Linkedin: Luís Santiago
  • GitHub: luis-antonio-dev
  • Instagram: dev__luis

Créditos