Unindo JavaServer Faces a Ajax: Melhorando o processo de desenvolvimento web
JavaServer Faces e Ajax estão cada dia mais no vocabulário do desenvolvedor web em Java: JavaServer Faces como uma promessa de uma nova forma desenvolvimento para a internet, incorporando diversas técnicas de desenvolvimento para desktop e Ajax como uma nova visão de trazendo novos conceitos e técnicas capazes de revolucionar o modelo atual de Desenvolvimento Web. Muitos dizem que estas novidades ajudam a dar corpo a Web 2.0, maximizando ao máximo a navegabilidade e a produtividade. Mas como isso é possível?
Vamos imaginar a seguinte situação: seu chefe acessa um aprovador de processos, onde ele escolhe o tipo do processo e são exibidos os processos pendentes. Pensando em uma aplicação clássica você teria no mínimo 2 solicitações completas: uma para mostrar os tipos de processos e outra para mostrar os processos pendentes. Utilizando estes conceitos podemos criar um solicitação completa, onde a página será gerada por completa e uma segunda solicitação passando apenas os dados, sem a necessidade re recarregar a página. Imagine que isto reduz a 10%, seu chefe ficará feliz e mais, você estará reduzindo custos com o pagamento do salário dele, dentre inúmeros outros ganhos indiretos, por exemplo.
Na próxima seção iremos dizer o que é e como AJAX pode ser utilizado para tornar este exemplo possível.
Introdução ao Ajax
Para muitos AJAX (Asynchronous Javascript And XML) pode ser uma nova tecnologia que está sendo disponibilizada no mercado para a geração de requisições ao servidor em background, enquanto o usuário continua interagindo com a página web até que aquela parte da página que gerou a requisição seja alterada. Mas se formos olhar nenhuma tecnologia foi acrescentada para se trabalhar com AJAX. Então o que seria AJAX?
Hoje a grande maioria das aplicações voltadas pela internet trabalham seguindo o princípio: O usuário cria uma requisição através de solicitação como por exemplo um clique em um link. O navegador de Internet gera uma solicitação HTTP e o Servidor recebe a requisição, processa-a e gerar uma resposta que na maioria das vezes é um documento em hipertexto (HTML). Assim, o workflow de navegação é controlado apenas pelo servidor como mostra a Figura 1.
Figura 1: Mostra a interação entre usuário e uma aplicação web clássica. Imagem retirada e traduzida do livro Ajax In Action. [CRANE, Dave; PASCARELLO Eric; JAMES Darren. Ajax in action. Editora Manning Publications, 2006. 18 p.]
Pode-se afirmar então que AJAX é uma metodologia de desenvolvimento que cria um novo modelo de aplicação, onde o navegador passa de um “Terminal Burro” para um container de aplicação, ou seja, o navegador deixa de exibir simplesmente conteúdo e passa a controlar eventos, executar scripts e remodelar o layout da página como mostra a Figura 2. Para fazer tudo isso, usa-se tecnologias que estão no mercado a algum tempo, estas tecnologias usadas em conjunto se complementam e geram bons resultados:
? JavaScript: É uma linguagem de scripts não totalmente orientada a objetos, mas mantém uma semelhança com a Linguagem Java em termos de sintaxe.
? CSS (Cascading Style Sheets): Também é uma linguagem de programação que contém estilos que descrevem o aspecto gráfico da página.
? DOM: Representa a página web em uma estrutura de objetos que proporciona acesso a atributos e métodos de cada recurso da página.
Figura 2: Mostra a interação entre usuário e uma aplicação
usando Ajax. Imagem retirada e traduzida do livro Ajax In Action. [CRANE, Dave; PASCARELLO Eric; JAMES Darren. Ajax in action. Editora Manning Publications, 2006. 19 p.]
Mas nem tudo é perfeito, infelizmente, ao se desenvolver aplicações usando os conceitos de AJAX nos deparamos com uma série de problemas: incompatibilidade entre navegadores, exposição da lógica de negócio, por exemplo. Ainda há outro problema, em muitos casos seu código pode ficar preso para apenas um tipo de apresentação, a reutilização é pequena, caso o navegador não suporte Javascript uma nova estrutura de páginas é desenvolvida gerando duplicação de código e o desenvolvedor web necessita de um bom conhecimento em javascript. Nas próximas sessão iremos ver como este problema pode ser contornado.
Introdução ao JavaServer Faces
JavaServer Faces é um poderoso framework para desenvolvimento Java EE. Seus princípios se baseiam no processamento de eventos gerados pelo usuário na página web como: um clique no botão, alteração do conteúdo de um campo de texto. E fica a cargo de você, programador, decidir o que quais deste eventos serão tratados, e que tipo de resposta será dada.
As bases de funcionamento de JSF é bastante similar ao Struts, usa o padrão Front Controler como base de funcionamento. Para ser processada uma página JSF ela deve passar por este controlador representado pelo servlet FacesServlet.
A execução de uma chamada JSF é dada pela seguinte seqüência: o FacesServlet recebe a chamada, ele cria o FacesContext, logo é atribuído o controle ao ciclo de vida (LifeCycle) que processa o contexto em 6 fases: reconstituição da view, aplicação dos valores da requisição, validação dos dados, atualização do modelo de dados, chamada ao aplicativo e geração da resposta.
Bom, com estas informações já é possível ter uma noção de como faces trabalha. Mas faces é um framework bastante flexível, além de possibilitar sua junção ao outros frameworks, há a possibilidade de criar componentes e renderizadores personalizados. Com isto você não fica preso aos componentes padrão, e com pouco trabalho você consegue personalizar um componente já existente, como veremos a seguir.
Criando componentes e Renderizadores
Os componentes padrões especificados pela implementação de referência (RI) atendem a maioria dos casos, mas nenhum deles até o momento possui implementação com características de uma aplicação Ajax, apenas seguindo o modelo clássico. Por outro, para evitar a reinvenção da roda, os componentes básicos já fornecem a base para você desenvolver seus próprios componentes.
Criar um componente JSF personalizado é um processo mais complexo e exige do desenvolvedor conhecimentos mais avançados da API Servlet e HTTP, e de linguagens como HTML, CSS, Javascript e DOM.
Componentes JSF podem ser renderizados, ou gerados, pelo próprio componente (implementação direta) ou através de renderizadores(implementação indireta). Seu uso é importante, pois pelos Renderizadores é possível determinar qual tipo de saída será gerada ao cliente, como HTML ou até mesmo para dispositivos móveis.
Mas até o momento a especificação JSF não possui quase nenhum requisito para renderizadores, apenas tipos e comportamentos para o RenderKit padrão em HTML. Agora vamos ver as vantagens de se agregar Ajax aos componentes.
Unindo JavaServer Faces a Ajax
Bom, mas onde então entraria o Ajax? Lembra do nosso problema de duplicação e reutilização de código Javascript? Chegamos a um ponto interessante, criando componentes nos possibilita evitar que estes problemas sejam criados. Por exemplo, você precisa de um campo para validar as informações inseridas, como checar se o nome de usuário digitado é válido. Sua preocupação com incompatibilidade de navegadores e geração do código javascript estará apenas durante o desenvolvimento do componente. Depois de testá-lo sua única preocupação será em utilizar o componente de forma adequada.
E o melhor, você pode reutilizar este componente para as mais diversas necessidades sem que você preocupe com a geração da resposta final ao usuário. Uma conseqüência deste modelo é que, as equipes de desenvolvimento poderão estar separadas, cada uma desempenhando um determinado papel no processo de desenvolvimento, sem que haja um prejuízo final.
Atualmente já estão disponíveis diversos projetos e produtos de componentes JSF usando Ajax. Dentre eles alguns merecem destaque: o Sandbox sub-projeto do Apache MyFaces e o Ajax4jsfj da Exadel, ambos open-source e o IceFaces proprietário, além de diversos componentes disponibiliza também um componente para webmails.
Conclusão
Hoje as páginas de internet estão passando por um processo de reformulação, onde o navegador de internet está deixando de ser apenas um visualizador de páginas para se tornar um container de aplicações. Vimos também que não há nada de revolucionário neste novo modelo, apenas usando as tecnologias já existentes, organizando-as em uma melhor forma para ganhar produtividade e reduzir tráfego na rede.
Foi possível ver que a utilização de JavaServer Faces para desenvolver este tipo de aplicação é altamente rentável, há uma grande flexibilidade, possibilita a reutilização de código e divisão de papéis no desenvolvimento de uma aplicação. Essencial para grandes equipes de desenvolvimento.
No próximo artigo mostrarei na prática como gerar um componente em Ajax, detalhando mais como é o processo de criação de componentes que foi abordado muito superficialmente neste artigo. Espero que tenham gostado e espero vocês no próximo mês.
Referências
Livros:
Ajax in Action – Manning Publications
JavaServer Faces in action – Manning Publications
JavaServer Faces - O'Reilly
Links Importantes:
http://java.sun.com/javaee/javaserverfaces – Site oficial da implementação JavaServer Faces.
http://jcp.org/en/jsr/detail?id=127 – Especificação JavaServer Faces no JCP.
https://ajax4jsf.dev.java.net – Projeto de extensões dos componentes padrões adicionando a eles funcionalidades Ajax.
http://myfaces.apache.org/sandbox/index.html – Projeto de testes de novos componentes para o projeto Tomahawk do Apache Myfaces.
http://www.icesoft.com/products/icefaces.html – Framework com diversos recursos integrando Ajax e JSF.
