De que se trata o artigo

O artigo trata de como desenvolver aplicações ASP.NET com AJAX utilizando controles e componentes baseados em servidor do ASP.NET. Através do AJAX, será possível carregar informações de uma página sem a necessidade de recarregar toda a estrutura do site.

Em que situação o tema é útil

O tema é útil no desenvolvimento de Web Applications com AJAX. Com a utilização do mesmo, você ganha uma alternativa para que suas aplicações não recarregam toda sua estrutura de interface na solicitação de um link, por exemplo. Além de ganhos com trafego de redes, a performance da aplicação é um fator de ganho com o uso do mesmo.

AJAX no ASP.NET – Aplicações com maior performance

Ninguém contesta o fato de que as aplicações Web se tornaram muito comuns. Graças a linguagens como PHP, ASP, Java e recentemente ASP.NET o seu desenvolvimento se tornou mais acessível para um maior número de desenvolvedores. Mas, mesmo com tantas facilidades, ainda existem questões como o seu desempenho que é sempre um ponto importante a ser considerado.

Um dos principais pontos de atenção refere-se ao PostBack das páginas, que é o processo pelo qual os dados são recarregados na página e que causam para o usuário o efeito piscante que é o que acontece quando todo o conteúdo da página é recarregado.

Uma das alternativas a fazer é usar recursos como o JavaScript para que somente os dados sejam recarregados na página. Esta linguagem oferece muitos recursos e tornam as aplicações Web mais dinâmicas e atraentes para o usuário, por outro lado, exige um aprendizado que leva algum tempo.

Desde a versão cinco do Internet Explorer um recurso foi acrescentado aos browsers para permitir a renderização parcial das páginas HTML de uma maneira mais simples. Entretanto, sua implementação é sempre difícil por causa da necessidade de conhecimentos avançados de programação com o JavaScript. Mas, para os programadores do Framework .NET tudo tornou-se mais simples com a implementação do AJAX ASP.NET que permite que se continue usando os server controls em suas páginas mas, com o Partial Page Update.

Além deste recurso com ASP.NET existem mais ferramentas que serão brevemente apresentadas durante o artigo, entre eles, o jQuery.

Desenvolver aplicações WEB traz aos desenvolvedores e usuários algumas vantagens, entre elas, a não instalação da aplicação Web para ser acessada, bastante apenas um Browser.

Apesar de tantas vantagens chegou-se a um ponto no desenvolvimento que começou a chamar a atenção. Com o aumento do número de projetos, muitos destes faziam um tráfego intenso de dados, não só trazendo imagens e texto, mas também vídeo e outras mídias. Com isso, o consumo da banda de dados aumentou e um fator começou a tornar-se crítico: quando havia a necessidade de recarregar os dados da página havia o desagradável efeito de redesenhar a página inteira o que, dependendo da quantidade de elementos, leva um tempo considerável.

Os caminhos a seguir eram abandonar as páginas muito complexas ou criar uma alternativa que permitisse que somente os dados fossem atualizados enquanto o layout pudesse manter-se inalterado.

Inicialmente a resposta para esta necessidade é o desenvolvimento com JavaScript. Ainda hoje este é usado de forma intensa, pois parte do processamento é realizada no lado do usuário sem a necessidade de tráfego na rede. Porém, para fazer isto, a programação torna-se complexa e exige mais tempo para ser elaborada.

AJAX com ASP.NET é uma alternativa para o desenvolvimento de projetos mais dinâmicos e com uma experiência de interface mais rica.. Com este recurso, o usuário pode continuar usando os ServerControls do ASP.NET em um projeto Web padrão do Visual Studio e ao mesmo tempo, permitir que apenas os dados da página sejam atualizados provocando uma experiência melhor para o usuário que não precisa esperar a página inteira ser redesenhada para cada atualização dos dados.

Webforms e a questão do Postback

Ao fazer desenvolvimento com ASP.NET tradicional, para cada ação do usuário é necessário realizar uma chamada ao servidor, executar o processamento neste e recarregar a página inteira com os dados que são retornados pelo processo que é conhecido por PostBack.

A partir da versão 5.0 do Internet Explorer, um objeto chamado XMLHttpRequest permitiu que fossem feitas chamadas para um servidor JavaScript para envio e recepção de dados. Com este objeto já não é mais necessária a carga total da página, sendo possível atualizar apenas aquelas seções onde os dados precisam ser atualizados.

Isto apresentou uma vantagem enorme para as aplicações Web e passou a ser usada também por outros browsers, o que viabilizou sua adoção pelos desenvolvedores. Agora as aplicações não precisariam mais ter o aspecto de algo demorado, pouco elaborado e tedioso de se usar. Os projetos Web começaram a ter uma interface com o usuário tão dinâmica como aplicações desktop. No início, começaram a ser usadas em aplicações como WebMail. Atualmente este recurso esta praticamente em toda Web, desde redes sociais a portais corporativos.

Entretanto para os desenvolvedores, inicialmente houve uma perda de agilidade de desenvolvimento. Durante os primeiros anos da década de 2000 as tecnologias de desenvolvimento de projetos Web apontavam para uma evolução na mesma direção das aplicações desktop. Para os programadores que usavam o ASP e mais tarde o ASP.NET, os Server Controls podiam ser arrastados para a página usando os designers de ferramentas como o Visual Studio. Este tipo de projetos ainda não dispunham dos recursos proporcionados pelo XMLHttpRequest e se fosse necessário usar, o código deveria ser feito manualmente já que inicialmente o ASP.NET não possuía ferramentas para interagir com este objeto dos browsers.

Nota do DevMan

Server Controls são objetos ASP.NET. Os mesmos são executados quando uma página é solicitada e renderiza eles no navegador. Muitos desses controles são semelhantes aos elementos HTML, como botões e caixas de texto. Outros controles, no entanto, possuem comportamento complexo, como os controles de calendário ou controles que gerenciam as conexões de dados.

AJAX Enabled

AJAX é um acrônimo que significa Asynchronous Javascript And XML. O mesmo em conjunto com o XMLHttpRequest dos browsers permite a atualização parcial do conteúdo de uma página Web.

Com esta tecnologia o servidor fornece dados que irão participar da renderização da página no browser do usuário. Os dados fazem parte do conteúdo que pode corresponder a controles como botões, caixas de listagem e texto que já foram carregados previamente e que agora, são apenas preenchidos com os dados vindos do servidor.

AJAX não é uma tecnologia pertencente a nenhuma empresa mas, um padrão para renderização parcial de páginas Web, fazendo com que somente parte do seu conteúdo seja carregada. Esta tecnologia está disponível no Visual Studio e nos projetos ASP.NET desde as versões iniciais do framework .NET e permite que se faça uso dos Server Controls que são muito flexíveis para trabalhar com dados e fáceis de configurar, mas habilitados para interagir de uma forma com a aplicação que não há mais a necessidade de recarregar a página inteira para apresentar os dados.

Nota do DevMan

XMLHttpRequest é uma API disponível em linguagens de script para navegadores web tais como JavaScript. É utilizada para enviar requisições HTTP ou HTTPS diretamente para um servidor web e carregar os dados de resposta do servidor diretamente de volta ao script. Os dados podem ser recebidos do servidor através de JSON, XML, HTML ou como texto puro.

JSON é um acrônimo para "JavaScript Object Notation", é um formato leve para intercâmbio de dados computacionais. É um subconjunto da notação de objeto do JavaScript, mas seu uso não requer JavaScript exclusivamente.

Como usar AJAX com ASP.NET

No Visual Studio 2010 ao criar um projeto do tipo Web Application você pode habilitá-lo para usar “Page Partial Rendering” com apenas com alguns passos.

Nem todas as páginas ASPX do seu projeto precisarão necessariamente ser alteradas, apenas aquelas em que você desejar habilitar atualização parcial do conteúdo. Inicialmente deve se arrastar para o designer (ou incluir na marcação HTML <form>) um controle do tipo ScriptManager. A ...

Quer ler esse conteúdo completo? Tenha acesso completo