app en tiempo real con html5+node.js+socket.io

18
HTML5 – Node.js – Socket.io Aplicaciones Web en tiempo real

Upload: waltter-gerez

Post on 13-Jun-2015

2.929 views

Category:

Technology


0 download

DESCRIPTION

Presentación de mi charla de app en tiemp real con Node.js y Socket.IO en el #BarCampNea

TRANSCRIPT

Page 1: App en tiempo real con HTML5+Node.js+Socket.IO

HTML5 – Node.js – Socket.io

Aplicaciones Web en tiempo real

Page 2: App en tiempo real con HTML5+Node.js+Socket.IO

¿Qué es una aplicación web en tiempo real?

• http://www.lightstreamer.com/demo/StockListDemo/

Page 3: App en tiempo real con HTML5+Node.js+Socket.IO

Comunicación bidireccional entre el servidor y los usuarios

aa b

b

Servidor Web

Page 4: App en tiempo real con HTML5+Node.js+Socket.IO

1 Antecedentes

Limitaciones de la Web actual

Page 5: App en tiempo real con HTML5+Node.js+Socket.IO

Pull (Así funciona la Web)Servidor Web

Petición

Navegador Web

Respuesta

Page 6: App en tiempo real con HTML5+Node.js+Socket.IO

Push (Lo que necesitamos)Servidor WebNavegador Web

DatosEvento

Page 7: App en tiempo real con HTML5+Node.js+Socket.IO

Desde hace algunos años existen soluciones pero son poco eficientes…

Servidor Web

Ajax (Polling)

peticiónrespuesta

petición

respuesta

petición

respuesta

Page 8: App en tiempo real con HTML5+Node.js+Socket.IO

• Script de prueba para Apache 2.2 con PHP 5.3

<?phpsleep(3);echo «hola mundo»;?>

Simulamos con un script, una petición que toma3 segundos en ejecutarse.

Page 9: App en tiempo real con HTML5+Node.js+Socket.IO

0

1

2

3

4

5

6

7

8

9

10

apache 2.2

Los servidores web tienen un número limitado de procesos…

Comportamiento de Apache 2.2 con 1000 peticiones, 100 de ellas concurrentes

Peticiones

Page 10: App en tiempo real con HTML5+Node.js+Socket.IO

Servidores tipo Comet

Misma infraestructura, diferente filosofía

2

Page 11: App en tiempo real con HTML5+Node.js+Socket.IO

Con los servidores tipo Comet nos acercamos mucho más a la solución ideal…

Servidor tipo Comet

Long pollingpetición

respuesta

petición

respuesta

petición

Page 12: App en tiempo real con HTML5+Node.js+Socket.IO

Algunos servidores Comet / Websockets…

Python Java .Net Ruby Javascript

TornadoTwisted…

CometdProtcoloBayeux

GlassFishActiveMQ…

WebSync Protocolo Bayeux

Thin/Faye protocolo Bayeux

Node.js*Es posible ejecutarlo en Windows Azure

Open Source Open Source Comercial Open Source Open Source

Page 13: App en tiempo real con HTML5+Node.js+Socket.IO

Acerca de Node.js

• Basado en el motor Javascript Google V8

• Todas las operaciones son asíncronas

• Uno de los servidores más rápidos del mercado

• Altamente eficiente• Ideal para la creación de

aplicaciones en tiempo real

Page 14: App en tiempo real con HTML5+Node.js+Socket.IO

En Node.js todas las operaciones son asíncronas. No usa procesos…

Comportamiento de Node.js con 1000 peticiones, 100 de ellas concurrentes

0

1

2

3

4

5

6

7

8

9

10

Node

Series2

Peticiones

Tiempo (s)

Page 15: App en tiempo real con HTML5+Node.js+Socket.IO

WebSockets con HTML5

En el futuro y presente

3

Page 16: App en tiempo real con HTML5+Node.js+Socket.IO

Con el API de WebSockets se crea un canal bidirecional…

Servidor con soporte paraWebSockets

respuesta

respuesta

inicio

Page 17: App en tiempo real con HTML5+Node.js+Socket.IO

Ejemplos con Node.js y Socket.io

El futuro

Desde un chat simple, hasta startups innovadoreshttp://www.dymotics.com/

4

Page 18: App en tiempo real con HTML5+Node.js+Socket.IO

Walter Gerez@wgerezSkype: walter.gerezFace: wgerez

Gracias