160 likes | 271 Views
The Stateful & Realtime Web. Chris Gomez chris@chrisgomez.com www.chrisgomez.com Twitter: @SpaceShot Go Here - http://bit.ly/SSMusicCC. Definitions. “HTML5” “AJAX” – xmlhttprequest “Modern Browsers” – Latest Firefox or Chrome, IE 9 or 10 (lean towards 10). Developing for the Web.
E N D
The Stateful & Realtime Web Chris Gomezchris@chrisgomez.comwww.chrisgomez.com Twitter: @SpaceShot Go Here - http://bit.ly/SSMusicCC
Definitions • “HTML5” • “AJAX” – xmlhttprequest • “Modern Browsers” – Latest Firefox or Chrome, IE 9 or 10 (lean towards 10).
Developing for the Web Ruby On Rails CGI/ISAPI ODBC Web Server NoSQL MongoDB NodeJS Database HTTP Requests RavenDB ASP.NET MVC Linq to SQL Cookies EF Code First Cassandra ASP.NET Web API AJAX CouchDB ASP.NET (WebForms) XML JSONP SQL Server Access Static HTML Jade SQL Server Express Classic ASP SQL Server Compact Sinatra
The Stateless Web(or “Who are you? What’s going on here?”) Hey, it’s John Baird Ugh, you forgot? Hold a sec… Web Server Who? Database Try a cookie? Let’s see… Requests Jim Bear… John Barker… John… Baird!Here’s SessionState! Finally… Great, thanks!Here’s howthe web pagelooks now!
When does this approach break down? • Loading of complex and fast changing state • Instant updates to the browser • Working around the “page cycle”
What’s a “Stateful” Web Server? This is Chris, I moveda token to 100,100 Web Server Requests Hey, John moveda token to 100,100
Board game scenario • All players can join at any time and view the game state as it currently is • All players can join the chat and talk in real time • All players can move game tokens around at any time • Other players see the tokens in motion • The game board is extensible via a nice scripting language that people out there might actually know instead of something you made up yourself on the weekend and threw out there… leaving me with something totally unusable and slow and buggy with hack after hack to try to make it right instead of just using something that’s practically universal like oh… I dunno… Javascript!!
File > New Project • ASP.NET MVC 4 Web Application • Basic Type (nothing done for you) • No Unit Tests • Razor
Steve Sanderson’s “App” Layouts • http://blog.stevensanderson.com/2011/10/05/full-height-app-layouts-a-css-trick-to-make-it-easier/ • Don’t think this is the only way or the only place or the only guy looking at this
NuGet Package Restore • Enables you to commit to source control without all of the binary dependencies. • Technically this works for javascript packages, too. Explore this feature for production use! You may want to go a different way.
HTML5 Canvas • “Immediate Mode” rendering • <canvas> tag • Only accessible via Javascript Use a library or toolkit!
EaselJS • Part of CreateJS Suite
SignalR • Started as open source project (within Microsoft ASP.NET team) • In PreRelease as a full member of ASP.NET. Soon to be 1.0! • Moving into Microsoft.AspNet.SignalR • Supporting web clients and ASP.NET servers • Also supports .NET Clients and WinRT clients. • You can “self-host”
Web Server --MVC on IIS-- --Console App –--“GameHub”-- Game Board Archectiture I deliver HTML/JS to bootstrap Requests I maintain & update game state as it happens
Javascript Engines • NOT the same as letting user script run in the browser • This is running on the server • Use a Javascript implementation to drive adoption of your API or platform • There are Javascript developers already out there! • No one writes CustomSuperDuperScriptXPlus!
Hosting Javascript Console App NoesisJavacsript Engine Context “map” GetTokenList