Latinoware 2012 - Desenvolvendo Interfaces com Holy

Post on 29-Jun-2015

341 views 1 download

description

Apresentação divulgada na Latinoware 2012 - Desenvolvendo Interfaces com Holy - por Leandro Guimarães

Transcript of Latinoware 2012 - Desenvolvendo Interfaces com Holy

about.me/leguimas

Leandro Guimarães

1997 2003

2008

holyho.ly

n santuário, lugar sagrado. • adj santo,sagrado, consagrado, divino. he took holyorders ele tornou-se padre. Holy CrossDay Dia da Exaltação da Cruz. Holy ofHolies Santíssimo, Santuário. holyorders clero.

Teve sua “origem” na época da Guerra Fria com pesquisadores militares americanos pensando em um meio de distribuir suas informações

diminuindo a vulnerabilidade das bases americanas.

ARPANET - Advanced Research Projects Agency

Década de 70

RFC 685 com a descrição doprotocolo TCP/IP.

Avanço em redes privadas.

Década de 80

Grandes redes integradas porTCP/IP.

Abertura comercial em 1988.

Década de 90

Grandes redes integradas porTCP/IP.

Criação da World Wide Web(WWW).

Popularização (Brasil – 1995).

Sistemas

• Domínio da arquitetura cliente-servidor (desktop);

• Processamentos cada vez mais complexos e pesados;

• Clients cada vez mais robustos;

• Dependência “geográfica” para acesso à informação;

• Hardware alto custo.

[ 1995 – 2000 ]

Clientes (“escalabilidade”) mais robustos a um alto custo.

Dependência “geográfica” para acesso à informação.

Comunicação entre máquinas geograficamente separadas.

Possibilidade de transitar dados de forma confiável.

+

Acessar a informação de qualquer lugar.

Investir em servidores mais robustos mas que concentrem o

processamento.

Ter clients mais enxutos, consequentemente, mais baratos.

Do desktop para a WEB...

Nos primórdios...

Servidor Clients

Tecnologias “embrionárias” e bastante simples.

Páginas dinâmicas.

Simples “consumidores” de informações.

Recursos precários para exibição de dados.

Nos primórdios...

Com o passar do tempo...

Servidor

Com o passar do tempo...

Client

Barateamento

Desenvolvimento da tecnologia

(JavaScript, jQuery, CSS, HTML5)

Mas...

Consequências...

Servidor Clients

Sobrecarregados em não só se responsabilizar pelo

processamento de dados mas também por preparar a visualização dos dados pelo

client.

Dificuldades de escalabilidade.

Capacidade ociosa: o servidor prepara tudo

mesmo o client fornecendo uma capacidade incrível para a visualização, e até

processamento, de informações.

Comprometimento da usabilidade.

Testemunho

Desenvolver um novo CMS para a Globosat.

(2008)

Testemunho

Principais dificuldades encontradas:

Conteúdo altamente dinâmico;

Conciliar usabilidade e formuláriosgerados dinamicamente;

Além disso...

Gostamos de prototipação mas os protótipossão desperdiçados pois não são reaproveitados;

E se a gente separasse, efetivamente, o cliente (visualização e input de dados) do servidor (obtenção e processamento de dados)? Os browsers atualmente tem

tecnologia suficiente pra obter dados e renderizar a visualização na tela da melhor forma com a usabilidade e

design que se queira...

Paulo Murer

Outra coisa: pra que precisa renderizar a página toda vez que qualquer alteração nela precisa ser feita? Se precisar

mudar só um label, precisa renderizar a página toda?

E se a gente gosta de protótipos, por que não criar um jeito de se fazer protótipo que possa ser reaproveitado?

Paulo Murer

O que é?

Uma solução open-source para o desenvolvimento WEB na qual se isola, efetivamente, cliente e

servidor. O servidor tem como responsabilidade “somente” a gestão dos dados enquanto o cliente tem

como responsabilidade interagir com o servidor, enviando e obtendo dados, e renderizar as

informações na tela.

http://holy.dextra-sw.com

Como funciona?

Para as ações na sua aplicação, você faz uma requisição AJAX para o seu servidor obtendo a resposta

necessária. De posse da resposta, você chama um template que renderizará os dados recebidos na

página da sua aplicação.

Como assim?

Como assim?

HTML<body>

<div id=“myDiv”>

</div>

</body>

Servidor

HTTP REST

JSON

$.ajax()

Obtenção dos dados

Como assim?

HTML<body>

<div id=“myDiv”>

</div>

</body>

Servidor

HTTP

TEMPLATE XML

$.holy()

<template selector=“#myDiv">

<span>${dado}</span>

</template>

Obtenção do template

Como assim?

HTML<body>

<div id=“myDiv”>

<span>Hello</span>

</div>

</body>

Servidor

Renderização dos dados(trimpath)

Benefícios

• Real separação entre cliente e servidor;

• Desenvolvimento de protótipos funcionais e 100% reaproveitáveis;

• Tecnologias padrão de mercado (W3C) e amplamente conhecidas;

• Acervo de componentes: tudo o que a WEB oferece;

• WEB API “de graça”;

• Facilidade de desenvolvimento de novas camadas de interface;

Benefícios

• Facilidade para a implementação de testes automatizados – controle total sobre os componentes;

• Independência da plataforma utilizada no servidor;

• Economia de processamento no servidor de aplicação;

• Facilidade para escalar seu sistemas (sessionless);

• Foco na usabilidade e, se eu quiser, no design da aplicação.

Tendências

Leaving JSPs in the dust: moving LinkedIn to dust.js client-side templates.

http://bit.ly/R8UMgg

Improving performance on twitter.comhttp://bit.ly/R8UPc2

@leguimas

leandro.guimaraes@dextra.com.br

leguimas

Casos de SucessoSOFTWARE LIVRE

AGILE COM PONTO DE FUNÇÃO

ATA DE REGISTRO DE PREÇO

www.dextra.com.br/arp