Estudo de caso de framework/toolkit AJAX: XML11

1
Estudo de caso de framework/toolkit AJAX XML11

• Rodrigo Rage Ferro
• ProfFrancisco Reverbel
• MAC 0462/5863 - Sistemas de Middleware Avançados

2

• Modelo Clássico Web
• AJAX
• XML11
• Arquitetura
• Demo
• Trabalhos Futuros
• Conclusão

Agenda
3
Modelo Clássico
Modelo Síncrono ( Aplicação Web Tradicional )
Figuras extraídas de GARRETT ( 2005 ).
4
Definindo AJAX

• AJAXAsynchronous JavaScript And XML
• Método de como projetar aplicações Web,
  utilizando um conjunto de tecnologias Web padrões
  existentes XHTML, CSS, DOM (Document Object
  Model), XML, XMLHttpRequest.

5
Modelo AJAX
Modelo Assíncrono ( Aplicação AJAX ) - Figuras
extraídas de GARRETT ( 2005 ).
6
Comparando Desempenho...
Comparação aplicação tradicional Web versus uma
aplicação Ajax. (retirado do livro Ajax in
Action)
7
AJAX
Vantagens Desvantagens
Maior interatividade nas aplicações Capacidade limitada
Redução do consumo de banda Comportamento dos botões Back e Forward
Redução do processamento no servidor Performance do cliente
Não é proprietário Feedback para o cliente
Portabilidade JavaScript (para diferentes browsers)
8
XML11

• XML11 é um projeto Open Source que começou na San
  Francisco State University em 2004.
• XML11 ajuda desenvolvedores na tarefa de escrever
  JavaScript ? diminui custos, minimiza risco e
  acelera tempo para desenvolvimento de aplicações
  em AJAX.
• Write Java Once, Run AJAX Everywhere

9
XML11 inspirado em X11
plum
X11-Protocol
X11-Client

• Network transparent windowing protocol
• X11 desenvolvido no MIT em 1984.
• X11-protocol é bem granular pixels em vez de
  widgets(buttons, list boxes,)
• Requer high-bandwidth e baixa latência na
  conexão.

10
Motivação para XML11

• Situação atual
• Medium-bandwidth, alta latência, conexões em
  grandes áreas
• Clientes como web browser, PDAs, etc.
• X11 não adequado para aplicações bem distribuídas
• ? por isso XML11
• Protocolo X11 em mais alto nível de abstração.
• Buttons and checkboxes em vez de pixels and
  lines
• XML11
• independente do dispositivo final
• assíncrono
• Baseada em XML, protocolo baseado em eventos
  (resposta com PDU Protocol Data Unit em XML),
  usa SOAP.
• Migração de Código
• Interação Operacional o código migrado pode
  fazer invocação remota de objetos.

11
Protocolo XML11
ltxml11gt ltcreate id1gt ltlabel x0
y10gtPhonelt/labelgt lt/creategt ltcreate
id2gt ltinput x50 y10 maxlen14/gt
lt/creategt lt/xml11gt
ltxml11gt ltupdate id2gt1-415-555-1212lt/updategt
ltevent id3 typeclicked/gt lt/xml11gt
12
Protocolo XML11
Elementos do XML11 Descrição
ltbuttongt, ltlabelgt, ltinputgt, Standard GUI widgets. Baseado em XUL (Projeto Mozilla).
ltcreategt, ltnew-valuegt, ltdestroygt Create, update e destroy widgets.
ltcodegt Migra parte da lógica de aplicação para o cliente.
lteventgt Eventos UI (interface do cliente) surgem e são enviados para o servidor.
ltupdategt Atualizações do Modelo são enviadas tanto pelo cliente qto pelo servidor.
13
Migração de Código

• O elemento ltcodegt de XML11 permite enviar parte
  da lógica de aplicação para o cliente.
• Idéia uso de linguagem de programação baseada em
  XML
• Bem adequado com o protocolo XML11 (baseado em
  XML)
• Mantém independência com o dispositivo final
• Problemas
• verbose (muitas linhas de código)
• Ferramentas de suporte insuficientes
• Solução XMLVM

ltcodegt lt!- application logic --gt lt/codegt
14
XMLVM

• XMLVM é uma linguagem de programação baseada em
  XML
• Sintaxe de XMLVM é baseada em Java Byte Code
  language ? para cada instrução Java Byte Code
  existe uma instrução XMLVM , por ex., ltiadd/gt
  para somar integers
• Resultado XML-based assembly language para Java
  VM
• XMLVMs podem automaticamente ser criadas a partir
  de Java class files.

ltinvokevirtual class-type"java.io.PrintStream"
method"println"gt ltsignaturegt ltreturn
type"void" /gt ltparameter type"java.lang.Stri
ng" /gt lt/signaturegt lt/invokevirtualgt
15
Exemplo Java Hello World
public class HelloWorld static public void
main(String args)
System.out.println("Hello World")
HelloWorld.java
HelloWorld.class
javac
xmlvm
HelloWorld.xmlvm
16
Example XMLVM Hello World
lt?xml version"1.0" encoding"UTF-8"?gt ltxmlvmgt
lt!--Generated Tue Aug 10 171014 PDT 2004--gt
ltclass name"HelloWorld" isPublic"true"
isSynchronized"true extends"java.lang.
Object"gt lt! code for constructor removed
--gt ltmethod name"main" isPublic"true"
isStatic"true" stack"2" locals"1"gt
ltsignaturegt ltreturn type"void" /gt
ltparameter type"java.lang.String" /gt
lt/signaturegt ltcodegt ltgetstatic
class-type"java.lang.System" type"java.io.PrintS
tream field"out"/gt
ltldc type"java.lang.String" value"Hello World"
/gt ltinvokevirtual class-type"java.io.Prin
tStream" method"println"gt ltsignaturegt
ltreturn type"void" /gt
ltparameter type"java.lang.String" /gt
lt/signaturegt lt/invokevirtualgt
ltreturn /gt lt/codegt lt/methodgt
lt/classgt lt/xmlvmgt
17
XMLVM para Outras Linguagens

• Visto que a Java VM é uma simples stack-based
  machine, XMLVM pode facilmente ser mapeada para
  outras linguagens
• Esta conversão é feita usando XSLT (uso de regras
  em xml)
• Mapeamentos existem para JavaScript e C
• O XSLT excerpt abaixo demonstra a conversão de
  ltiadd/gt (Integer add) para JavaScript

lt!-- iadd --gt ltxsltemplate match"iadd"gt
ltxsltextgt __op2 __stack--__sp //
Pop operand 1 __op1 __stack--__sp //
Pop operand 2 __stack__sp __op1
__op2 // Push sum lt/xsltextgt lt/xsltemplategt
18
Exemplo JavaScript Hello World
// JavaScript function HelloWorld()
HelloWorld.main function(__arg1)
var __locals new Array(1) var __stack
new Array(2) var __sp 0 var
__op1 var __op2 __locals0
__arg1 var __next_label -1
while (1) switch (__next_label)
case -1 case 0
__stack__sp java_lang_System.out
__stack__sp "Hello World"
__sp - 2
__stack__sp.println(__stack__sp 1)
case 1 return
default alert("XMLVM internal
error reached default of switch")

19
Invocação Remota de Objetos

• Middleware Implícito
• Proxy (enviado em XMLVM)

20
Implementação de um protótipo de XML11

• Cliente
• Standard web browser
• XML11 protocol client escrito em JavaScript
• Servidor
• Aplicação Java AWT/Swing
• Lógica de aplicação convertida para JavaScript a
  partir de um XMLVM
• Re-uso de AWT/Swing ao implementar a
  java.awt.Toolkit interface
• Sem necessidade de mudar a aplicação legada.
• Uso de HTTP para o transporte (uso de HTTP POST)

XML11 sobre HTTP
21
Demo

• Demo overview
• Label, Button, List, TextField, TextArea
• GridBagLayout, BorderLayout,FlowLayout
• Panel com overloaded paint()
• 2 Java classes com 650 linhas de código.
• 2.500 linhas de XMLVM
• 2.600 linhas de JavaScript

22
Trabalhos Futuros

• Desenvolver protótipos mais convincentes
• Potenciais Projetos
• Especificação Formal de XML11
• Portar XML11 client para PDAs, Macromedia Flash
• Suporte para mais AWT/Swing widgets
• Melhorar conversão de XMLVM e extender para
  outras linguagens, por ex., conversão para .NETs
  Intermediate Language (IL)

23
Conclusão

• XML11 é independente de dispositivo
• Middleware implícito
• Uso de proxy para invocação remota de objeto
• Migração de Código baseado em XMLVM

24
Referências

• Maiores informações sobre XML11 lt www.xml11.org
  gt
• Puder A.,XML11 - An Abstract Windowing Protocol.
  PPPJ Journal Special Issue, Elsevier.
• James Garrett, Ajax A New Approach to Web
  Applications,
• http//adaptivepath.com/publications/essays/archiv
  es/000385.php
• Acessado em 07/11/2006.
• CRANE, Dave. et al. Ajax in Action. Manning
  Publications Co. 2006. ISBN 1-932394-61-3.
  E-book.
• GARRETT, JESSE J. Ajax A New Approach to Web
  Applications, Adaptive Path Publications,
  18/02/2005. Disponível em lthttp//www.adaptivepat
  h.com/publications/essays/archives/000385.phpgt.
  Acessado em 07/11/2006.
• REIS, Ricardo. et al. Artigo AJAX Introdução.
  13/12/2005. Disponível em lthttp//pwp.net.ipl.pt/
  alunos.isel/24138/AJAX/IntroducaoAJAX.pdfgt.
  Acessado em 07/11/2006.

25
Interessante

• Palestra de 1 hora aprox. sobre XML11 disponível
  em
• lthttp//video.google.com/videoplay?docid-31715821
  87051229467gt
• Acessado em 07/11/2006.