Ajax: Uma Nova Tcnica para Aplicaes Web

Se alguma das atuais interaes no design podem ser chamadas de glamurosas, a criao de aplicaes Web. Apesar de tudo, quando foi ltima vez que voc ouviu algum se entusiasmar com a interao de design de um produto que no est na Web? (alem do iPod). Todos os novos projetos inovadores legais so on-line. A respeito disso, desenvolvedores de interatividade na web no podem ajudar, mas sentem uma pontada de inveja de nossos colegas que criam softwares de desktop. Aplicaes desktop tm uma riqueza e comunicabilidade que tem parecido fora de alcance na Web. A mesma simplicidade que permite a proliferao rpida da Web tambm cria uma barreira entre as experincias que podemos prover e as experincias que os usurios podem conseguir de uma aplicao desktop. Esta barreira est desaparecendo. D uma olhada no Google Suggest. Observe o modo como atualizam os termos sugeridos conforme voc digita (digite vagarosamente para ver as mudanas). Agora olhe para o Google Maps. Aproxime. Use seu cursor para capturar o mouse e rol-lo um pouco. De novo, tudo acontece quase instantaneamente, sem esperar pelo carregamento de pginas. Google Suggest e Google Maps so dois exemplos de uma nova tcnica para aplicaes web que a Adaptive Path tem chamado de Ajax. O nome a abreviao para Asynchronous Javascrit and XML, e representa um passo fundamental para o que possvel na Web.

Definindo Ajax
Ajax no uma tecnologia (vamos prestar ateno nisso). , na verdade so vrias tecnologias, cada uma atuando da sua prpria maneira, tornando-se juntas uma poderosa possibilidade. Ajax incorpora: 1. 2. 3. 4. 5. Apresentao baseada nas Web Standards usando XHTML e CSS. Exibio e interao dinmicas usando Document Objetct Model (DOM); Troca e manipulao de dados usando XML e XSLT; Retorno de dados assincronamente usando XMLHttpRequest; E JavaScript interligando tudo.

O modelo clssico de uma aplicao web trabalha como essa: A maior parte das aes do usurio na interface faz uma requisio HTTP de volta ao servidor web. O servidor processa retornando dados, interpretando nmeros, conversando com vrios sistemas legados, e ento retorna uma pgina (X)HTML para o cliente. Esse um modelo adaptado do uso original da Web como um hipertexto mdio, mas como os fs do The Elements of User Experience sabem, o que faz a web boa para hipertexto no a torna, necessariamente, boa para aplicaes de software.

Figura 1: O modelo tradicional para aplicaes web(esquerda) comparado ao modelo Ajax (direita). Essa tcnica faz muito sentido, mas no para uma grande experincia do usurio. Enquanto o servidor est fazendo esta processando as requisies, o que o usurio est fazendo? Est certo, esperando. E a cada etapa da tarefa o usurio espera mais um pouco. Obviamente, se desenvolvemos a Web para trabalhar com aplicaes, ns no faremos o usurio esperar. Uma vez que uma interface carregada, por que a interao do usurio deve sofrer uma parada a cada vez que a aplicao precisa de algo do servidor? De fato, por que o usurio deve ver a aplicao ir para o servidor afinal?

Como o Ajax diferente

Uma aplicao Ajax elimina o natural carrega-para carrega-para da atual interao na Web, introduzindo um intermedirio, ou seja, uma ferramenta Ajax entre o usurio e o servidor. Parece que se adicionarmos uma camada para a aplicao a tornaria menos comunicativa, mas o oposto disso verdade. Em vez de carregar uma pgina web, no incio da sesso, o browser carrega uma ferramenta Ajax, escrita em JavaScript e geralmente colocada sobre um frame escondido. Esta ferramenta responsvel por renderizar a interface que o usurio v e pela comunicao com o servido em prol do usurio. A ferramenta Ajax permite que a interao do usurio com a aplicao acontea assincronamente, independente da

comunicao com o servido Ento o usurio nunca encarar uma janela branca do browser e um cone de ampulheta, esperando pelo servidor para fazer algo.

Figura 2: O padro de interao sncrono de uma aplicao web tradicional (topo) comparada ao padro assncrono de uma aplicao Ajax (embaixo). Toda ao do usurio que normalmente geraria uma requisio HTTP toma, ao invs disso, a forma de uma chamada JavaScript para a ferramenta Ajax. Qualquer resposta para a ao do usurio que no requer uma viagem de volta ao servidor, como validaes simples de dados, manipulao de dados na memria, e at mesmo alguma navegao tratada pela prpria ferramenta. Se a ferramenta precisa de algo do servidor para responder, ou seja, dados submetidos para processamento, carregamento de cdigo de interfaces adicionais, ou retorno de novos dados, a ferramenta faz essas requisies assincronamente, geralmente usando XML, sem parar a interao do usurio com a aplicao.

Quem est usando Ajax

Google est fazendo um gigantesco investimento no desenvolvimento de aplicaes Ajax. Todos dos maiores produtos do Google introduzidos nos ltimos anos, como Orkut(?), Gmail, as ltimas verses betas do Google Groups, Google Suggest e Google Maps, so aplicaes Ajax. (Para saber mais sobre essas tcnicas doidas e descries dessas implementaes Ajax, cheque estas excelentes anlises do Gmail, Google Suggest e Google Maps). Outros esto seguindo essas caractersticas: algumas das funcionalidades que as pessoas amam no Flickr dependem do Ajax, e a ferramenta de busca A9 da Amazon aplica tcnicas similares. Estes projetos demonstram que Ajax no s tecnicamente possvel, mas tambm implementado por aplicaes no mundo real. Esta no outra tecnologia que trabalha somente em laboratrio. Aplicaes Ajax podem ser de qualquer proporo, desde algo muito simples, como as funes de escolha do Google Suggest at algo muito complexo e sofisticado como Google Maps. Na Adaptive Path, ns temos feito nosso prprio trabalho com Ajax atravs dos ltimos meses, e apesar de tudo que j fizemos, somente arranhamos a superfcie das interaes ricas e comunicabilidade que as aplicaes Ajax podem prover. Ajax uma importante desenvoltura para aplicaes Web, e essa importncia tende somente a crescer. E devido a existirem tantos desenvolvedores que j sabem como usar essas tecnologias, ns esperamos ver muito mais organizaes seguindo a direo do Google, recolhendo as vantagens competitivas que o Ajax oferece.

Indo Adiante
Os enormes desafios em criar aplicaes Ajax no so tcnicas. O corao das tecnologias Ajax maduro, estvel, e bem conhecido. Ao contrrio disso, os desafios so para os desenvolvedores dessas aplicaes: esquecer o que ns achamos saber sobre as limitaes web, e comear a imaginar uma longa e rica gama de possibilidades. Isto est se tornando divertido.

Ajax P&R (Perguntas e Respostas)

Maro 13, 2005: Desde quando o foi publicado a artigo de Jesse, recebemos uma enorme quantidade de correspondncia dos leitores com questes sobre Ajax. Neste P& R, Jesse responde algumas dessas questes mais comuns. A Adaptive Path inventou o Ajax? Foi o Google? Adaptive Path ajudou a construir as aplicaes Ajax do Google? Nem a Adaptive Path, nem o Google inventaram o Ajax. Os produtos recentes do Google so simplesmente os exemplos mais aperfeioados de aplicaes Ajax. Adaptive Path no esteve envolvida no desenvolvimento das aplicaes Ajax do Google, mas ns estamos trabalhando com Ajax para muitos de nossos outros clientes. A Adaptive Path est vendendo componentes Ajax ou comercializando o nome? Onde eu posso baix-lo?

R. Ajax no algo que voc possa baixar. uma tcnica - um modo de pensar sobre a arquitetura de aplicaes web usando certas tecnologias. Nem o nome Ajax, nem as tcnicas so proprietrias da Adaptive Path. O Ajax apenas outro nome para XMLHttpRequest? No. XMLHttpRequest somente parte do conjunto Ajax. XMLHttpRequest o componente tcnico que torna possvel a comunicao assncrona com o servidor; Ajax nosso nome para as tcnicas abrangentes descritas no artigo, que incluem no somente o XMLHttpRequest, mas tambm CSS, DOM, e outras tecnologias. Por que vocs sentiram a necessidade de dar a isso um nome? Eu precisei de algo mais curto que Assncrono JavaScript+CSS+DOM+XMLHttpRequest para usar quando discutia essa tcnica com clientes. Tcnicas para comunicao assncrona com o servidor tm estado por perto h anos. O que faz do Ajax uma nova tcnica? O que novo o uso proeminente destas tcnicas nas aplicaes no mundo real para mudar o modelo de interao fundamental da Web. Ajax est pegando agora porque estas tecnologias e o entendimento da indstria de como us-las mais eficientemente levam tempo para serem desenvolvidas. O Ajax uma plataforma tecnolgica ou um estilo de arquitetura? So ambos. Ajax um conjunto de tecnologias sendo usadas juntas de um modo particular. Pra que tipos de aplicao o Ajax melhor adaptado? No sabemos ainda. Porque essa uma tcnica relativamente nova, nosso entendimento de onde Ajax pode melhor ser aplicado est ainda na sua infncia. Algumas vezes o modelo de aplicao web tradicional a mais apropriada soluo para o problema. Isto significa que a Adaptive Path anti-Flash? No totalmente. Macromedia um cliente da Adaptive Path, e temos sido grandes patrocinadores da tecnologia Flash. Com o amadurecimento do Ajax, esperamos que algumas vezes Ajax torne-se a melhor soluo para um problema particular, e algumas vezes Flash seja a melhor soluo. Ns estamos tambm interessados em explorar de que modo as tecnologias podem ser misturadas (como no caso do Flickr, que usa ambos). Ajax tem acessibilidade significativa ou limitaes de compatibilidade dos browsers? Aplicaes Ajax interrompem o boto Voltar? Ajax compatvel com REST? Existem consideraes de segurana no desenvolvimento Ajax? Aplicaes Ajax podem ser feitas para trabalhar para usurios que tm JavaScript desativado? A resposta para todas essas questes talvez. Muitos desenvolvedores j esto trabalhando sobre essas indagaes. Ns achamos que existe mais trabalho a ser feito para estipular todas essas limitaes do Ajax, e esperamos que a comunidade de desenvolvimento Ajax publique mais artigos como este. Alguns dos exemplos do Google que voc citou no usam XML em tudo. Eu tenho que usar XML e/ou XSLT em uma aplicao Ajax? No. XML o meio mais completo desenvolvido de conseguir dados dentro e fora de um cliente Ajax, mas no h razes para voc no poder obter os mesmos efeitos usando tecnologias como Notao de Objeto JavaScript ou algum meio similar de estruturamento de dados para intercmbio. Aplicaes Ajax so mais fceis de desenvolver que aplicaes web tradicionais?

No necessariamente. Aplicaes Ajax inevitavelmente envolvem cdigo JavaScript complexo rodando no cliente. Tornar este complexo cdigo eficiente e livre de bugs no uma tarefa para ser tomada negligentemente, e ferramentas de desenvolvimento melhores e frameworks sero necessrios para ajudar-nos neste desafio. Aplicaes Ajax sempre fornecem uma experincia melhor que as aplicaes web tradicionais? No necessariamente. Ajax fornece interaes mais flexveis. Entretanto, quanto mais poder ns temos, mais cuidado devemos ter em us-lo. Devemos ser cautelosos ao usar Ajax para melhorar as experincias do usurio nas nossas aplicaes, nao esquecer disto.