Javascript ao Infinito e Além

32
Javascript ao infinito e além Rafael Specht da Silva @rafael_sps

description

Palestra dada no Tchêlinux Pelotas 2014 abordando algumas APIs promissoras e exemplos de aplicações utilizando-as

Transcript of Javascript ao Infinito e Além

Page 1: Javascript ao Infinito e Além

Javascript ao infinito e além

Rafael Specht da Silva@rafael_sps

Page 2: Javascript ao Infinito e Além

Quem?

- Formado em Telecomunicações no IFSul- “Contribuidor” na Hack Thursday- Ex Eckert-Caine- Ex / Atual RBS

Page 3: Javascript ao Infinito e Além
Page 4: Javascript ao Infinito e Além

Javascript é uma linguagem bem legal, mas...

0.3 === 0.1 + 0.2 // false

// porque...

0.2 + 0.1 === 0.30000000000000004 // true

// exemplo by Douglas Crockford

Page 5: Javascript ao Infinito e Além

Isso é quase engraçado...

Page 6: Javascript ao Infinito e Além

Javascript é útil para …

Page 7: Javascript ao Infinito e Além

… fazer relógios

Page 8: Javascript ao Infinito e Além

… validar formulários

Page 9: Javascript ao Infinito e Além

… AWESOMENESS

Page 10: Javascript ao Infinito e Além

“Existem mais APIs entre o céu e a terra do que sonha vossa vã filosofia”

(talvez pra fazer o que já se fazia no desktop e/ou devices...)

Page 11: Javascript ao Infinito e Além
Page 12: Javascript ao Infinito e Além
Page 13: Javascript ao Infinito e Além

WebSockets

Uma maneira de trocar informação em “tempo real”

SSE resolve(rá) o problema de “só receber”

Page 14: Javascript ao Infinito e Além

LocalStorage

Armazena strings localmente sem incluí-las no cabeçalho HTTP como o Cookie

Page 15: Javascript ao Infinito e Além

WebSockets + LocalStorage

- LocalStorage é comum para um domínio

- Então, permite trocar informações entre janelas/abas

- Logo, LocalStorage permite compartilhar informações recebidas pelo Socket entre janelas/abas

Page 17: Javascript ao Infinito e Além

Network Information API

Porque nem sempre sabemos a situação da conexão do usuário…

Page 18: Javascript ao Infinito e Além
Page 19: Javascript ao Infinito e Além

Network Information API

var connection = navigator.connection || navigator.mozConnection || navigator.webkitConnection;

bandwidth - estimativa da banda atual

metered - a banda do usuário pode sofrer limitações

Page 20: Javascript ao Infinito e Além

Page Visibility API

Permite obter o status de visibilidade de um documento

(talk is cheap…)

Page 21: Javascript ao Infinito e Além

Battery API

Page 22: Javascript ao Infinito e Além

Battery API

Provê informações sobre a bateria do dispositivo do usuário

window.navigator.battery

Page 23: Javascript ao Infinito e Além

Push State

Page 24: Javascript ao Infinito e Além

Push State

Acesso ao histórico do browser

window.history

(talk is cheap...)

Page 25: Javascript ao Infinito e Além

Web Audio API

Page 26: Javascript ao Infinito e Além

Web Audio API

Acesso e manipulação de um contexto de áudio

Page 27: Javascript ao Infinito e Além

Qual a diferença para a tag <audio>?

- Manipular propriedades do sinal de áudio- Possibilidade de adicionar ganho, filtros, etc- Manipular espacialização- etc

Page 28: Javascript ao Infinito e Além

Oscillators

Podemos criar ondas:- sinusoidais- dentes-de-serra- triangulares- quadradas(demo)

Page 29: Javascript ao Infinito e Além

Exemplos em produção

Muito útil para jogos e apps onde podemos melhorar a experiência e imersão

- Jogo “mano-a-mano” (link, github)- Guitarra HTML5 (link, github)

Page 30: Javascript ao Infinito e Além

Release the Unicorns

Page 31: Javascript ao Infinito e Além

Processamento de Áudio

Métodos como ‘createMediaStreamSource’ e ‘createScriptProcessor’ permitem manipular o áudio em tempo real.

Por que não fazer um pedal de guitarra?

(altamente inspirado pelas palestras do @almirfilho (link) e do @eshiota (link)

Page 32: Javascript ao Infinito e Além

Obrigado!!@rafael_spsgithub.com/[email protected]/rafaelspdasilva