Estudo de caso de framework/toolkit AJAX: XML11

Rodrigo Rage Ferro Prof:Francisco Reverbel MAC 0462/5863 - Sistemas de Middleware Avançados Estudo de caso de framework/toolkit AJAX: XML11

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

Modelo Clássico: Modelo Síncrono ( Aplicação Web Tradicional )– Figuras extraídas de GARRETT ( 2005 ).

Definindo AJAX • AJAX=“Asynchronous 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.

Modelo AJAX: Modelo Assíncrono ( Aplicação AJAX ) - Figuras extraídas de GARRETT ( 2005 ).

Comparando Desempenho... Comparação: aplicação tradicional Web versus uma aplicação Ajax. (retirado do livro “Ajax in Action”)

AJAX:

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”

apple X11-Server XML11 inspirado em : X11 plum • 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. X11-Protocol X11-Client

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.

UI/Atualizações do Modelo, Código Device Application Eventos, Atualizações do Modelo Protocolo XML11 <xml11> <create id=“1”> <label x=“0” y=“10”>Phone</label> </create> <create id=“2”> <input x=“50” y=“10” maxlen=“14”/> </create> </xml11> <xml11> <update id=“2”>1-415-555-1212</update> <event id=“3” type=“clicked”/> </xml11>

Protocolo XML11

Migração de Código • O elemento <code> 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 <code> <!-– application logic --> </code>

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., <iadd/> para somar integers • Resultado: XML-based assembly language para Java VM • XMLVMs podem automaticamente ser criadas a partir de Java class files. <invokevirtual class-type="java.io.PrintStream" method="println"> <signature> <return type="void" /> <parameter type="java.lang.String" /> </signature> </invokevirtual>

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

Example: XMLVM “Hello World” <?xml version="1.0" encoding="UTF-8"?> <xmlvm>  <class name="HelloWorld" isPublic="true" isSynchronized="true“ extends="java.lang.Object"> <!– code for constructor removed --> <method name="main" isPublic="true" isStatic="true" stack="2" locals="1"> <signature> <return type="void" /> <parameter type="java.lang.String[]" /> </signature> <code> <getstatic class-type="java.lang.System" type="java.io.PrintStream“ field="out"/> <ldc type="java.lang.String" value="Hello World" /> <invokevirtual class-type="java.io.PrintStream" method="println"> <signature> <return type="void" /> <parameter type="java.lang.String" /> </signature> </invokevirtual> <return /> </code> </method> </class> </xmlvm>

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 <iadd/> (Integer add) para JavaScript:  <xsl:templatematch="iadd"> <xsl:text> __op2 = __stack[--__sp]; // Pop operand 1 __op1 = __stack[--__sp]; // Pop operand 2 __stack[__sp++] = __op1 + __op2; // Push sum </xsl:text> </xsl:template>

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; __locals[0] = __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"); } } } }

Invocação Remota de Objetos • Middleware Implícito • Proxy (enviado em XMLVM)

Tomcat Web Browser Java Application AWT/Swing XMLVM XML11 Client XML11 Toolkit XML11 Server 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

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

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)

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

Referências • Maiores informações sobre XML11: < www.xml11.org > • 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/archives/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: <http://www.adaptivepath.com/publications/essays/archives/000385.php>. Acessado em: 07/11/2006. • REIS, Ricardo. et al. Artigo AJAX: Introdução. 13/12/2005. Disponível em: <http://pwp.net.ipl.pt/alunos.isel/24138/AJAX/IntroducaoAJAX.pdf>. Acessado em: 07/11/2006.

Interessante • Palestra de 1 hora aprox. sobre XML11 disponível em: <http://video.google.com/videoplay?docid=-3171582187051229467> Acessado em: 07/11/2006.

Estudo de caso de framework/toolkit AJAX: XML11