JavaNoroeste Grupo de Usuários Java do Noroeste Paulista. AJAX e WEB 2.0

Transcrição

1 JavaNoroeste Grupo de Usuários Java do Noroeste Paulista AJAX e WEB 2.0

2 Carlos Fernando Gonçalves Mestre em Engenharia de Computação, área de concentração Engenharia de Software pelo IPT SP Bacharel em Física USP São Carlos SP Atua no mercado de desenvolvimento de sistema a mais de nove anos. Seis anos em desenvolvimento com tecnologia Java. Fundador do Grupo de Usuários Java do Noroeste Paulista

3 Ajax Asynchronous JavaScript+CSS+DOM+XMLHttpRequest Que teve o termo cunhado para Asynchronous JavaScript and XML.

4 O que é Ajax? Uma técnica adequada de utilização de DHTML. Substituição no modelo requisição/resposta de comunicação sincronizado pela comunicação assincrona; Separação da visualização e da busca dos dados;

5 AJAX e suas tecnologias HTML (ou XHTML) e CSS para apresentar as informações ; Document Object Model (DOM) que por meio de JavaScript interage dinamicamente com a informação apresentada; XHR XMLHttpRequest que troca dados assincronamente com o servidor Web, utiliza para tanto o XML, mas que funciona para qualquer formato texto ou mesmo HTML.

6 AJAX e suas tecnologias HTML (ou XHTML) CSS AJAX XMLHttpRequest JavaScript + DOM

7 História do AJAX O nome AJAX foi idealizado por Jesse James Garrett, que definiu o objeto XMLHttpRequest como um componente criado juntamente com o Internet Explorer 5, da Microsoft. Foi incorporado aos outros navegadores posteriormente.

8 Vantagens do AJAX Redução de banda A cada requisição que fazemos no navegador na Web, muitos objetos como menus, rodapé, figuras e dados, são carregados e a parte da informação o qual o usuário quer visualizar corresponde a uma pequena fração do que se vê na página carregada. Uma grande parte da banda é consumida na transferências do conteúdo da página que esta no servidor até o navegador.

9 Vantagens do AJAX Toda e qualquer transferência de dados que ocorre num website usa banda. Banda é algo que se paga caro. O ponto forte de AJAX esta exatamente na menor taxa de transferência de arquivos entre o servidor e o navegador, reduzindo muito mesmo o consumo de banda.

10 Vantagens do AJAX Rapidez Utilizando AJAX, ao carregar uma página o usuário terá facilidade e rapidez para buscar uma nova informação já que grande parte dos elementos de uma página estão carregados e visualizados no navegador. Isto torna a navegação uma tarefa mais ágil e agradável.

11 Vantagens do AJAX Interatividade Os elemento básicos de interatividade e usabilidade são disponibilizados de forma a não ter um elevado consumo de banda. AJAX melhora e agrega facilidades para o usuário.

12 Vantagens do AJAX Validação de dados É sempre complicado lidar com segurança e principalmente na internet tanto do lado do servidor e do navegador do usuário, trabalho dobrado. Com AJAX todo o processo de validação fica no lado do servidor, que permite ocultar as regras de negócio.

13 Vantagens do AJAX Interfaces sofisticadas. Fica bastante acessível colocar elementos gráficos de excelente qualidade ser ter a contrapartida de tornar a navegação mais lenta, pois cada componente não precisa ser novamente carregado a partir do servidor. Formulários podem ter multiplas ações sem que o mesmo precise ser carregado a cada nova etapa de preenchimento. Tudo ocorre pontualmente sem a necessidade de renderizar a página novamente.

14 Como funciona AJAX?

15 Como funciona AJAX?

16 XMLHttpRequest Objeto JavaScript Criado dentro de uma função JavaScript Adotado pelos modernos navegadores Mozilla, Firefox, Safari, e Opera Comunicação com o servidor via padrão HTTP GET/POST Objeto XMLHttpRequest trabalha em background Isto não interrompe a operação de usuário

17 XMLHttpRequest var req; function initrequest(url) { if (window.xmlhttprequest) { req = new XMLHttpRequest(); } else if (window.activexobject) { isie = true; req = new ActiveXObject("Microsoft.XMLHTTP"); } } function validateuserid() { if (!target) target = document.getelementbyid("userid"); var url = "validate?id=" + escape(target.value); initrequest(url); req.onreadystatechange = processrequest; req.open("get", url, true); req.send(null); }

18 XMLHttpRequest function processrequest() { var duplicatereq = req; if (req.readystate == 4) { if (req.status == 200) {...codigo... } } }

19 AJAX no GMail

20 Exemplo em AJAX

21 Principais notações e frameworks para AJAX JSON (JavaScript Object Notation) Dojo Toolkit DWR (Direct Web Remoting) GWT (Google Web Toolkit) code.google.com/webtoolkit/ Integração de JavaServer Faces (JSF) e AJAX jsf/

22 Dashboard, no Mac OS X Web 2.0

23 Experiência rica do usuário Usuário de computador: Editores, planilhas eletrônicas e clientes de e mail; Os programas são intuitivos e respondem bem rápido; Os programas dão retornos rápidos ao usuários como: Mudança de forma do cursor; Áreas sensíveis a passagem do mouse; Mudança de cor em textos selecionados.

24 Experiência rica do usuário O Lisa foi um computador pessoal (PC) revolucionário lançado pela Apple Computer em Foi o primeiro PC a ter um mouse e uma interface gráfica.

25 A Web no início...

26 A Web no início...

27 Características típicas de aplicação Web O usuário dá um clique, espera a tela ser atualizada e renderizada; Página atualizada vem com todas informações, eventos, dados para serem enviados e a navegação; O usuário tem que esperar a cada nova requisição pedida; O modelo de comunicação sincronizado request/response ; Todo o fluxo de trabalho ocorre no servidor.

28 Inconvenientes das aplicações Web Muito lenta a resposta; A cada processamento tudo é perdido na atualização; A resposta para o usuário não é instantânea e há necessidade de esperar a nova página ser carregada e renderizada; Uma grande quantidade de largura de banda é consumida no processo;

29 Web 2.0? O termo Web 2.0 refere se à segunda geração de serviços e aplicativos da Web e aos recursos, tecnologias e conceitos que permitem um maior grau de interatividade e colaboração na utilização da Internet. Fonte: wikipedia

30 O fenômeno da Web 2.0 Plataforma Web Os usuários de computador realizam suas atividades na Web; , chatting, compartilhamento de fotos; E um enorme número de aplicações se movendo a cada momento para Web; Aplicações que agregam recursos antes presentes somente em desktop; Facilidade e rapidez; Novas formas de colaborações com grupos de usuários, redes sociais.

31 Conceitos da Web 2.0 Tim O'Reilly A internet como plataforma; Melhor experiência do usuário; Valorização do conteúdo colaborativo e da inteligência coletiva; Fim dos ciclos de lançamento e atualização de softwares tradicionais; Quanto mais simples a programação, melhor.

32 Web 2.0 Marketing? Críticas Uma evolução do que já existia; Não ocorreram mudanças tecnológicas significativas na estrutura da grande rede; Não é uma tecnologia nova; Não existe consenso sobre o que exatamente é a Web 2.0.

33 Web 1.0 Websites Popups Diretórios na Web Classificados Web Web 1.5 Wikis Forum de discussão Yahoo Internet Bank Web 2.0 Blogger RSS Google HousingMaps.com Google Maps YouTube Google Video

34 Problemas Complexidade; Aprender JavaScript; Difícil tarefa de debugar; Expôr código fonte.

35 Grupo de Usuários Java Atualmente o JavaNoroeste é patrocinado por:

36 O JavaNoroeste agradece a presença de todos. FIM