Aplicações Web Realtime

Preview:

DESCRIPTION

Talk at FrontEnd Carioca, Rio de Janeiro, Brazil - 27/09/2014 In this talk, I show how realtime works and how you can build a better web application using good techniques. Medium: https://medium.com/@gabrielfgularte/understanding-realtime-web-apps-5aef47d51a45

Citation preview

Aplicações Web RealtimeSem mágicas e sem enrolação

Gabriel GularteWeb Developer at Mentis

CTO at EVIN

@gabrielfgularte

Como achamos que é...

Como é na verdade...

Técnicas de realtime na webWebsockets, Polling e Long Polling

Websockets

● Full-Duplex

● HTML5 API

● Especificação não está finalizada pelo W3C

● Não funciona em browsers antigos

Se você não precisa se preocupar com

navegadores antigos, use a vontade.

http://caniuse.com/#feat=websockets

Websockets

Websockets

http://www.slideshare.net

https://www.zendesk.com.br

Websockets

http://socket.io

Websockets

https://ws4py.readthedocs.org

Polling

● Loop que consome dados periodicamente

● Perde tempo em requests sem mudanças e tráfego

desnecessário

● Defasagem de tempo definido pelo delay do loop

● Funciona em todos os browsers

Péssima escolha para construir o seuwebapp realtime

Polling

Long Polling

● Uma única conexão até que haja mudança

● Poupa requests e tráfego de dados desnecessários

● Caso queira, ainda pode definir um tempo para timeout

● Funciona em todos os browsers

Melhor técnica para construir o seuwebapp realtime

Long PollingLong Polling

Long PollingLong Polling

Long PollingLong Polling

Resumo

● Nada é "real realtime". Tudo tem um tempo para acontecer

● Realtime é somente uma sensação (nothing more then feelings)

● Websockets é API e Polling/Long Polling é técnica

● Use Websockets se não precisa dar suporte para browsers

antigos

● Não use Polling, só é necessário pra entender a base do Long

Polling

● Long Polling é como pescar, pesque mais!

Muito obrigado!

https://github.com/gabrielfgularte/talks/tree/master/2014/frontendcarioca

https://medium.com/@gabrielfgularte/understanding-realtime-web-apps-5aef47d51a

45