Machine Learning
no Frontend
com Tensorflow.js
The Developer's Conference
Rodando modelos direto no Browser
Machine Learning no...
Machine Lea
Apresentação
Apresentação
Iasmim Oliveira
Staff Frontend Engineer
Staff Software Engineer
iFood
Tech Lead
Lucas Levandoski
Tech Lead
Elastacloud
Machine Lea
Apresentação
Introdução
Insert your topic here
Indo além da
IA Generativa
Machine Lea
Apresentação
Introdução
Introdução
Machine Lea
Apresentação
Introdução
Introdução
Tensorflow.js
Uma biblioteca que traz o runtime de ML para JavaScript, tanto no browser quanto em Node.js.
No navegador, você carrega um modelo pré-treinado, prepara o input (imagem, texto, áudio), roda predict() e transforma a saída em algo útil para a UI.
Machine Lea
Apresentação
Introdução
Overview
Overview
Custos
Latência
Privacidade
Acessível
O processamento acontece no dispositivo do usuário. Sua funcionalidade escala sem custos adicionais.
Resposta praticamente instantânea de UI.
Os dados do usuário (câmera, áudio) não saem do navegador.
É só JavaScript! Rode em qualquer navegador e crie features inteligentes que funcionam até sem interne
Machine Lea
Apresentação
Introdução
Overview
Overview
Use Cases
Aplicações de saúde: Pose Detection com MoveNet
Analisa a postura corporal em tempo real através da webcam para criar instrutores de fitness virtuais, guias de fisioterapia e experiências de bem-estar interativas.
Machine Lea
Apresentação
Introdução
Overview
Use Cases
Use Cases
Moderação de Conteúdo
Identifica linguagem ofensiva e indesejada diretamente no navegador antes que a mensagem seja enviada.
Machine Lea
Reporters
Introduction
Overview
Use Cases
Use Cases
Personalização de Performance em Larga Escala
Executa um modelo no browser para classificar a performance do dispositivo e otimizar a renderização da UI, garantindo uma experiência fluida para todos os usuários
Title Page
Reporters
Introduction
Insert your topic here
Machine Lea
Apresentação
Introducão
Overview
API
how it works?
como funciona?
o que é um tensor?
Machine Lea
Apresentação
Introdução
Overview
API
Tensores
Tensores
TensorFlow.js é um framework para definir e executar computação usando tensores em JavaScript.
Um tensor é uma generalização de vetores e matrizes para dimensões maiores
Title Page
Reporters
Introduction
Overview
Insert your topic here
Machine Lea
Apresentação
Introdução
Overview
API
Backend do browser
WASM
WebGPU
Backend do browser
Uma API JavaScript para renderizar gráficos 2D e 3D no navegador. Essencialmente, dá acesso à GPU.
Estável e amplamente utilizado.
WebGL
WebAssembly (WASM) é um formato de código binário que roda no navegador. Pode ser utilizado como fallback.
Ótima alternativa para dispositivos sem GPU potente.
É o sucessor do WebGL. Uma API moderna projetada não apenas para gráficos, mas para computação de propósito geral na GPU.
Suportado nos navegadores mais recentes
Title Page
Reporters
Introduction
Insert your topic here
Machine Lea
Reporters
Introduction
Overview
API
Insert your topic here
O runtime ativa um backend por vez e dá acesso a APIs de nível alto (Layers) e baixo (tensores/operações)
Title Page
Reporters
Introduction
Overview
Vantagens
Machine Lea
Apresentação
Introdução
Overview
API
API
ou
Vantagens
Machine Lea
Apresentação
Introdução
Overview
API
Insert your topic here
Title Page
Reporters
Introduction
Insert your topic here
Machine Lea
Apresentação
Introdução
Overview
API
Tensorflow.js
tf.loadGraphModel()
Inferência (Predição). É a escolha padrão para simplesmente usar um modelo pré-treinado no frontend.
tf.loadLayersModel()
Fine-Tuning (Transfer Learning) e inspeção do modelo
*ou você pode criar seu próprio modelo*
www.demo.com.br
DEMO
www.demo.com.br
DEMO
Machine Le
Apresentaç
API
Conclusion
Staff Software Engineer
Introdução
Overview
Process
QA + links
Questions
QA
Iasmim Oliveira
Lucas Levandoski
Tech Lead
Machine Le
Apresentaç
Introdução
Overview
API
Process
Conclusion
Referências
Resources
01
02
03
Repositório
Sources
04