Better Web Experience with ASP.NET by itchak

VIEWS: 685 PAGES: 23

Presentation about Introduction to ASP.NET AJAX

More Info
									Songsak Channarukul, Ph.D. Assumption University founder

Tanapol Pavadachochai Lead Developer Genxas

Introduction to ASP.NET AJAX AJAX Sample Partial Rendering
Enabling AJAX with UpdatePanels Optimizing UpdatePanels Usage

AJAX with Web Services Logical Navigation ASP.NET Control Toolkit Core Architecture of ASP.NET AJAX

Asynchronous JavaScript and XML Improving end-user perception and usability
Faster, smoother, intuitive Visually appealing Personalized

Improving network/bandwidth usage
Partial rendering Light-weight web service calls

Improving development approach to scripting
Namespaces, interfaces, inheritance Properties, events, dispose

Available at
Baseline – will be integrated into ASP.NET

Features that are not yet ready to be part of base product.

AJAX Control Toolkit
Built on ASP.NET AJAX, goal is to be community developed and supported Adds AJAXy behavior to ASP.NET Controls

AJAX Sample

Partial rendering via UpdatePanels Web services – AutoCompletionTextBox Customized progress Water Markup TextBox

Preserves postback programming model
UpdatePanels declare regions to update Easy and declarative Stateful (equivalent to a postback)
Init Load State

Process Postback


Form Submit
Form Data + Custom Header

Postback Events Save State PreRender Render


Partial Rendering Response


Enable AJAX with UpdatePanels

Partial rendering via UpdatePanels
Better user experience Ease of usage Server control More efficiency on network traffic (have better way to gain more efficiency)

Optimizing UpdatePanels Usage

Optimize what to update and when
UpdateMode=“Conditional” Use triggers, Update() for granular control

Postbacks are still postbacks
Which user actions should be postbacks? Carefully evaluate AutoPostBack Consider alternative means of interactivity

Data and operations exposed as web services
Support for SOAP (.asmx) and RESTful models JSON format, object serialization

Higher-level networking stack
Sys.Net.WebRequest – abstracts XMLHttpRequest Script proxies for .asmx enable simple method call model

Ideal for stateless requests
Lean wire format Generally useful in client-centric apps Alternative to partial updates where appropriate

Complementary models Partial rendering – when you need state, server-side control logic
Pros: easy to use, control properties, page state Cons: full postback, one at a time

Web services – when your logic is stateless
Pros: light-weight, parallel Cons: need to write necessary code to package UI as parameters

AJAX with Web Services

Postbacks flood navigation history with intermediate steps AJAX-based pages often have no history
Back button goes the whole way back to the previous page

How can we improve navigation?
App defines a set of logical views App controls which updates transition between views Logical views added to navigation history Bonus: bookmarking and indexing

Logical Navigation

Joint project between the community and Microsoft Built upon the ASP.NET 2.0 AJAX Extensions Aims to be the biggest and best collection of web-client components available

ASP.NET AJAX Control Toolkit

Building AJAX apps using ASP.NET –
Page developers get rich controls and behaviors Component developers get a well-orchestrated framework

Building rich client apps Server and Client components

Client FX (JS)
Type System,Type safety, OO concepts, Browser compat Component, Control, Behavior Service & app service proxies

Server FX
ExtenderControl ScriptControl ScriptManager UpdatePanel ..

Type.registerNamespace(‘Custom’) Custom.MyClass = function(..) { Custom.MyClass.initializeBase(..) }
Custom.MyClass.prototype = { get/set_propertyMember: function() methodMember: function(), add/remove_eventMember: function() } Custom.MyClass.registerClass( ‘Custom.MyClass’, Sys.UI.Control) new Error.argumentNull(..) Sys.UI.Control.isInstanceOfType( myClass_instance)

Namespaces Ctor

‘Class members’

Define class and inheritance

‘typed’ exceptions
Reflection-like APIs Debug and release scripts for development and production environments

ScriptManager: Manages the AJAX app in the server
Declarative and programmatic script references Handles scripts for:
Debug and release patterns Path-based and assembly-based script resources


ExtenderControl, WebScriptControl,
ScriptDescriptors for ‘instance’ scripts ScriptReferences for ‘library’ scripts

AJAX enables rich, next-generation apps ASP.NET AJAX makes it easy
Integrate AJAX patterns into ASP.NET model Simple out-of-the-box functionality Solid platform with extensibility to go further

1.0 shipped! Ready for primetime

To top