PartyRocking: Jugando con Javascript y Websockets
Upcoming SlideShare
Loading in...5
×
 

PartyRocking: Jugando con Javascript y Websockets

on

  • 850 views

En el mundillo web siempre hemos visto la comunicación síncrona como asignatura pendiente, hasta ahora las alternativas eran muy complejas, hasta la aparición de los websockets. ...

En el mundillo web siempre hemos visto la comunicación síncrona como asignatura pendiente, hasta ahora las alternativas eran muy complejas, hasta la aparición de los websockets.

Seguramente todos hemos alucinado con la creación de nuestro primer chat y nos hemos emocionado con sus posibilidades.

Nuestra propuesta es jugar con el chat hasta convertirlo en un juego matazombies, demostrando el potencial del mix Javascript, websockets con NodeJS, y terminar con un debate sobre las posibilidades de futuro.

Contenido de la charla:

- Tras una breve introducción de las tecnologías que vamos a utilizar. partiremos de una aplicación básica de chat, que iremos modificando hasta convertirla en un juego interactivo.

- Buenas prácticas y lecciones aprendidas, desde el despliegue en dispositivos móviles, la gestión de participantes, hasta la sincronización y rendimiento del interfaz.

- Visualización de algunas demos y ejemplos.

- Analizaremos las nuevas oportunidades en el mercado del Gaming, donde el rendimiento ya no es un problema con aceleradores de JS como CocoonJS o Famo.us, o la escalabilidad de los servicios de Websockets.

Para ver algunos experimientos, visitar:
http://www.partyrocking.tv

Statistics

Views

Total Views
850
Views on SlideShare
844
Embed Views
6

Actions

Likes
0
Downloads
5
Comments
0

1 Embed 6

https://twitter.com 6

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

PartyRocking: Jugando con Javascript y Websockets PartyRocking: Jugando con Javascript y Websockets Presentation Transcript

  • Partyrocking By @pekewake and @dvdchavarri
  • From Chat to Realtime Game Who we are. David Chavarri and Rubén Chavarri …where the idea comes from
  • Introduction What we are going to talk about Practical Example – ZombieRocking Personal Experience Future Possibilities
  • From Chat to Realtime Game …a little bit about the background HTML5 Tour: Programación de Videojuegos HTML5 Fernando Oteros Desarrollo de videojuegos en JavaScript Sergio Ruiz (@serginator) Carlos Benitez (@etnassoft) Implementar Websockets con... Jorge Del Casar (@jorgecasar)
  • From Chat to Realtime Game Technology
  • From Chat to Realtime Game 1) Scene 2) Events 3) Chat 4) ZombieRocking 5) World of ZombieRocking
  • From Chat to Realtime Game 1) Scene
  • From Chat to Realtime Game 1) Scene .html scene.js Our trick: CAAT no intrusive “Game Framework” that help us to encapsulate in our examples the “Canvas” interaction throw object concepts like Director, Scene, Actors & gameloop). other Frameworks ally.js
  • From Chat to Realtime Game 2) Events Behaviours Breath Walk - Wait Shot Input Controls
  • From Chat to Realtime Game 2) Events Behaviors Inputs
  • From Chat to Realtime Game 3) Chat io.sockets.emit(“msg”) socketio.emit(“msg”) socketio.emit(“msg”)
  • From Chat to Realtime Game 3) Chat Server (node) Client (html) source code
  • From Chat to Realtime Game 4) ZombieRocking Emit websocket action Left action Right action Wait action Shot Emit clientToServer
  • From Chat to Realtime Game 4) ZombieRocking Update Controls Manage Events
  • From Chat to Realtime Game 5) World of ZombieRocking emit clientToServer Emit websocket
  • From Chat to Realtime Game 5) World of ZombieRocking server (node) client
  • Now What? Let deploy the App in Smartphones !
  • Now What? Deploy the App in Smartphones Inconveniences WebSocket Support Performance Native Interaction
  • Inconveniences WebSocket Support http://caniuse.com/websockets
  • Inconveniences Performance - JS Acceleration CocoonJS - Canvas Acceleration http://sumonhtml5.ludei.com/ Famo.us - HTML Acceleration http://famo.us/
  • Inconveniences Native Interaction with HTML5 Capabilities Supported + Hybrid Approach GeolocationAPI Offline support WebStorage 2D animations Camera Notifications Sensors Device Info Market Store
  • Deploying the App in Smartphones Hybrid Mobile App Frameworks Cordova / PhoneGap (Javascript) (IBM Worklite, HP Anywhere, Intel XDK, SAP Platform –SUP) Appcelerator Titanium (Javascript) KonyOne (Lua & Javascript) Xamarin (C#) Rhodes (Ruby)
  • Deploying the App in Smartphones Appcelerator Titanium Proprietary Software Compiles to native code Proprietary JavaScript UI that maps to native OS UI Enterprise Support Android, IOS (Windows phone, BlackBerry and Tizen, soon) http://www.appcelerator.com/
  • Deploying the App in Smartphones Cordova PhoneGap Open Source Wraps the webView HTML5 & CSS3 Great OpenSource Community Most Mobile Platforms http://phonegap.com/
  • Now What? Deploy the App in Smartphones A few Pointers Data on the wire! Please don't send your app HTML from the server, Javascript does a perfect job rendering it Use local storage Whenever possible, show cached content to the user Write plugins & custom native UI Sometimes is worth the development of Native features
  • What about WebSockets Scalability? MVC Real-time frameworks Cross-platform OpenSource,Scaffolding Multilingual Yes Yes Resource View Presenter Model-View-Controller Model-View-Controller Active-Record MongoDB Design pattern Yes MongoDB Redis MySQL, MongoDB,Flat File, Redis, PostgreSQL Good Basic Good Reactive programming Component-oriented Pub/Sub Component-oriented Event-driven Reactive programming Event-driven 27% 38% 35% Database Community Driven Programming paradigm Preference http://vschart.com/compare/meteor-web-framework/vs/derbyjs/vs/sails-js
  • What about WebSockets Scalability? WebSocket Server Providers: Pusher http://pusher.com/ Firebase https://www.firebase.com/ Tambur.io https://www.tambur.io/
  • Just one more demonstration Demo Time !!! World of ZombieRocking
  • Our experiments http://www.partyrocking.tv
  • “Be Partyrocking my friend…” The twins By @pekewake.. @dvdchavarri