With WebForms, each ASP.NET page’s rendered output includes a <form> element that performs a postback to the
same page whenever a Button control within the form is clicked, or whenever the user modifies a control whose
AutoPostBack property is set to True. This model simplifies web page development, but carries with it some costs –
namely, the large amount of data exchanged between the client and the server during a postback. On postback the browser sends the
values of all of its form fields (including hidden ones, like view state, which may be quite large) to the server; the server then
sends back the entire contents of the web page. While there are some scenarios where this amount of information needs to be exchanged,
in many cases the user has performed some action that requires far less information to be exchanged. With a little bit of forethought
and code we can have the browser and server exchange much less data, which leads to more responsive web pages and an improved user
experience.
Over the past several weeks I’ve been writing an article series on accessing server-side data from client script. Rather than rely
solely on forms and postbacks, many websites use JavaScript code to asynchronously communicate with the server in response to the page
loading or some other user action. The server, upon receiving the JavaScript-initiated request, returns just the data needed by the
browser, which the browser then seamlessly integrates into the web page. There are a variety of technologies and techniques that can
be employed to provide both the needed server- and client-side functionality. Last week’s article, Using WCF Services with jQuery and the ASP.NET Ajax
Library, explored using the Windows
Communication Foundation, or WCF, to serve data from the web server and showed how to consume such a service using both the
ASP.NET Ajax Library and jQuery.
In a previous 4Guys article, Creating an Online
Boggle Solver, I built an application to find all solutions in a game of Boggle. (Boggle is a word game trademarked by Parker Brothers and Hasbro that involves several players trying to find as
many words as they can in a 4×4 grid of letters.) This article takes the lessons learned in Using WCF Services with jQuery and the
ASP.NET Ajax Library and uses them to update the user interface for my online Boggle solver, replacing the existing WebForms-based
user interface with a more modern and responsive interface. I also used jQuery Templates, a JavaScript-based templating library that is useful for displaying the results from a server-
side service. To read the entire article, Updating My Online Boggle Solver Using jQuery Templates and WCF, click here.