Wednesday, June 15, 2011

patterns & practices: Project Silk

FileDownload.aspx?ProjectName=silk&DownloadId=233650


Overview
Project Silk provides guidance for building cross-browser web applications with a focus on client-side interactivity. These applications take advantage of the latest web standards like HTML5, CSS3 and ECMAScript 5 along with modern web technologies such as jQuery, Internet Explorer 9, and ASP.NET MVC3.

To illustrate this guidance, the project includes a reference implementation called Mileage Stats that enables its users to track various metrics about their vehicles and fill-ups. Much of the effort in building Mileage Stats was applied to the usability and interactivity of the experience. Animations were included to enhance the enjoyment of the site and AJAX is used to keep the interface responsive and immersive. A great deal of care was also taken to ensure the client-side JavaScript facilitates modularity and maintainability. To accomplish these design goals, the JavaScript code was structured into “widgets” that benefit from the jQuery UI Widget Factory.

About the Mileage Stats RI
The Mileage Stats RI is a multi-page interactive web application where the pages are rendered without requiring a postback. This creates the illusion of a desktop application. The lack of postbacks enable rich UI transitions between states (pages.) The browser application runs very fast because of the client-side data caching.
The Mileage Stats RI JavaScript is modularized using jQuery UI Widgets. The widgets allow breaking the UI into small discrete stateful objects; providing a clean separation of responsibilities and concerns. See the Widget QuickStart (included with the latest download) for an example application that uses the jQuery UI widget factory.

Read more: Karl of WPF
Read more: Codeplex