frameworks ajax

Frameworks Ajax

Porque, quando e como usar um Framework Ajax para melhorar a produtividade

Agenda1. Apresentação!2. O que são Frameworks Ajax?3. Que tipos de Frameworks existem?4. Quais os benefícios de um Framework Ajax?5. Quais os requisitos de um Framework?

Christiano MilfontDeveloper, Programmer, Speaker,

Blogger, ...http://www.milfont.org

cmilfont@gmail.com

Apresentação

Frameworks Ajax

Frameworks Ajax

Anatomia do Ajax

1. Evento acionado no navegador2. Um XHR é instanciado3. A instância do XHR é configurada4. Uma solicitação com conexão assíncrona5. Requisição processada no servidor6. Retorno do servidor em XML ou texto7. XHR processa o retorno8. O HTML DOM processa o XML ou Texto

Anatomia do Ajax

1. Ocorre um evento no cliente

Anatomia do Ajax

Instancia uma versão do objeto XHR dependendo doBrowser, a Microsoft (criadora do objeto) tem algumasimplementações dependendo da versão do Internet Explorer.

2. Um XHR é instanciado

Anatomia do Ajax3. A instância é configurada

O método “open” do objeto XHR cria uma conexão e recebecomo parâmetros: o método de conexão (“POST” ou “GET”);a “url” do servidor; e um booleano que indica se a conexão éassíncrona (TRUE) ou síncrona (FALSE).

Associa-se uma função “callback” que processará o resultado do servidor.

Submete os dados caso a conexão seja POST.

Anatomia do Ajax4. Solicita uma conexão assíncrona

Quando a propriedade readStatedo objeto XHR recebe o valor 4 a conexão foi terminada, podemos processar diretamente ou somente quando a propriedade status receber o valor “200”.

Anatomia do Ajax5. A requisição é processada pelo servidor

O servidor processa uma requisição como outra qualquer e devolve um XML ou um texto.

6. O servidor retorna um XML ou um texto

É comum utilizar na resposta um texto com o objeto no formato JSON para ser processado na função callback.

Anatomia do Ajax

A função callback processa o retorno utilizando DOM.

7 e 8. Callback processa retorno

Anatomia do AjaxMétodos e propriedades do XHR

Status do readyState0: Não inicializado.1: Conexão estabelecida.2: Requisição recebida.3: Em processo.4: Finalizada.

Métodosopen(mode, url, boolean): inicializa aconexão e recebe os parametros mode(conexão), url e booleano (síncrono ouassíncrono).send("string"): Null para GET ou umaString dos parametros e valores parao POST.

AtributosreadyState: Troca valores de 0 a 4 que indicam que está “Ready”.Status: Códigos de status do response HTTP.responseText: Processa a resposta como texto.responseXML: Processa a resposta como um objeto XML.onreadystatechange: Propriedade que recebe uma função queé invocada quando o evento readystatechange é disparado.

Frameworks Ajax

Frameworks Ajax

Tipos de Frameworks

Javascript Multipurpose Frameworks

Javascript Multipurpose: frameworks que fornecessem componentes sobre o conjunto de todas as tecnologias web no lado cliente e mecanismos de acesso ao lado servidor, como o encapsulamento do tratamento dos dados.

Tipos de Frameworks

Javascript Remote: frameworks que são especialistas no encapsulamento do mecanismo de troca de objetos entre as camadas físicas.

Javascript Remoting Frameworks

Tipos de Frameworks

Javascript Specialised Frameworks

Javascript Specialized: frameworks que são especialistas em somente um determinado comportamento ou mecanismo do conjunto de tecnologias web, como por exemplo: especialistas em efeitos ou somente na extensão do javascript.

Tipos de Frameworks

Benefícios

O benefício de se usar um Framework Ajax é o encapsulamento da complexidade de manipulação das tecnologias necessárias, fornecendo um só mecanismo Cross Browser que permita a utilização do ajax com acessibilidade semelhante ao ambiente desktop, além de facilitar o tratamento dos dados nas as camadas físicas entre o lado cliente e o lado servidor.

BenefíciosUm Framework Ajax utiliza as tecnologias:

CSS (camada de formatação da apresentação);

XHTML (camada de estrutura da apresentação);

XML (dados a serem manipulados) e

JSON (outra especificação do formato dos dados); Javascript (camada de controle) por meio de DOM (modelo de árvore de objetos) e com o objeto XMLHttpRequest (que fornece conexões assíncronas).

Extende essa tecnologias padrões com componentes de eventos, efeitos, Drag'n'Drop, entre outros.

Frameworks Ajax

Frameworks Ajax

Frameworks Ajax

Frameworks Ajax

Frameworks Ajax

Frameworks Ajax

Frameworks Ajax

Frameworks Ajax

GRID

Frameworks Ajax

Windows

Frameworks Ajax

TabPanel

Frameworks Ajax

TreePanel

Frameworks Ajax

ComboBox

Frameworks Ajax

Forms

Frameworks Ajax

Menus e Toolbar

Ajax Resourceshttp://www.ajaxian.com/ http://www.milfont.org/LivrosZAKAS, Nicholas. Professional JavaScript for Web Developers. Indianapolis, Indiana: Wiley Publishing Inc.,2005.ZAKAS, Nicholas; MCPEAK, Jeremy; FAWCETT, Joe. Professional Ajax. 2nd Edition. Indianapolis, Indiana: Wiley Publishing Inc.,2007.ASLESON, Ryan; SCHUTTA, Nathaniel. Foundations of Ajax. Berkeley, CA: Apress, 2006GROSS, Christian. Ajax Patterns and Best Practices. Berkeley, CA: Apress, 2006.CRANE, Dave; PASCARELLO, Eric; JAMES, Darren. Ajax in Action. Greenwich, CT: Manning Publications Co., 2006.

Referências

Obrigado!

Dúvidas ?Christiano Milfont

http://www.milfont.org