Conceitos de programação AJAX

Programação Java para Web

Prof. Wagner Macedo

Asynchronous

JavaScript

And

XML

Sobre AJAX

AJAX é um conjunto de tecnologias.

  • HTML e CSS Apresentação
  • Document Object Model (DOM) Interação
  • XML ou JSON Formato de troca de dados
  • XMLHttpRequest Aquisição de dados

E para unir tudo isso, usamos JavaScript!

Interação Web Tradicional

Interação Web AJAX

Como AJAX funciona?

Como AJAX funciona?

1. Um evento ocorre na página web - A página é carregada, um botão é clicado… 2. Um objeto XMLHttpRequest é criado pelo JavaScript 3. O objeto XMLHttpRequest envia uma requisição ao servidor web 4. O servidor processa a requisição 5. O servidor devolve a resposta para a página web 6. A resposta é lida pelo JavaScript 7. Uma ação apropriada é feita pelo JavaScript

Jesse James Garrett, quem cunhou o termo AJAX, explica a fraqueza da interação tradicional:

A abordagem clássica faz sentido tecnicamente, mas não oferece uma boa experiência de usuário.

Enquanto o servidor está processando uma coisa, o que o usuário está fazendo? Isso mesmo, esperando!

AJAX

Vantagens 👍
- Melhor usabilidade - Aplicações mais ricas, com mais interações - Browser sem plugins - Interfaces responsivas - Aplicações requerem menos largura de banda - Menos processamento no lado servidor
Desvantagens 👎
- Suporte complicado para diferentes browsers - Botão de _back_ pode não funcionar como esperado - URL não se altera com as mudanças de tela - Debug mais difícil - Maior processamento no lado cliente
Leitura Recomendada 🔖
Manual de jQuery
MDN: AJAX
AJAX Introduction

Capítulo 24: AJAX

Dúvidas?

Este slide pode ser encontrado em:
http://prof.wagnermacedo.com/2017-2/PJW/17