Marco Gomes

nerd veterano, interneteiro profissional, parkouzeiro amador, evangélico aprendiz, fotógrafo iniciante

Textos marcados como ‘navegador’

Nova geração de aplicativos que rodam no navegador

Publicado em 2008-06-25, 19 comentários

Se você já conhece a história das aplicações ajax[bb] e sabe o que é um framework[bb] pule direto para a novidade.

No início eram trevas

As primeiras aplicações Web tinham interatividade mínima, estavam no velho modelo clica, recarrega, clica, recarrega. Isso porque o navegador só requisitava dados do servidor no momento de abrir a página, qualquer nova informação que não estivesse no documento desde o início exigia uma recarga da página. Trevas.

Então veio o AJAX

O AJAX é uma maneira de carregar e enviar dados sem necessidade de reload, aplicações como Meebo e boo-box fazem uso dessa tecnologia pra trocar informação com o servidor sem precisar de um reload no documento. O Meebo carrega novas mensagens do chat, o boo-box carrega os produtos, tudo sem necessidade de reloads constantes.

Pra facilitar o desenvolvimento de aplicações que usem AJAX, surgiram as primeiras bibliotecas e frameworks JavaScript.

O que é uma biblioteca de software?

Biblioteca é uma coleção de subrotinas usadas pra desenvolver software. Bibliotecas contém código e dados, que provêm serviços pra programas independentes.

Tradução livre de Wikipedia: Library (computing)

O que é um framework de software?

Um framework de software é o esqueleto de uma aplicação que pode ser customizada por um desenvolvedor de aplicação. Como as bibliotecas de software, ele ajuda o desenvolvedor por conter código-fonte que resolve problemas específicos e contém uma API simples. No entanto, enquanto bibliotecas de software atuam como escravas de outros programas, frameworks de software invertem o relacionamento mestre-escravo. Essa inversão, chamada Inversão de Controle, é a essência de frameworks de software.

Tradução livre de Wikipedia: Software framework

Os aplicativos rodando no navegador que imitam aplicativos nativos do sistema operacional

Tela da aplicação 280 Slides

Mesmo com o desenvolvimento do AJAX, ainda é extremamente difícil desenvolver aplicações que rodem no navegador e funcionem de maneira fluída, como se fossem aplicações desktop. As dificuldades são inúmeras: interpretação de código entre as diferentes versões de navegadores, peculiaridades de sistemas operacionais, lentidão de ter uma tonelada de código rodando no browser que é monoprocessado (monothread), problemas intrínsecos na linguagem utilizada, seja JavaScript, ActionScript ou qualquer outra.

Frameworks pra desenvolvimento client-side

Os primeiros frameworks e bibliotecas para criação de aplicações no navegador corrigiram vários dos problemas citados, Google GWT, Yahoo UI e Ext.js corrigem incompatibilidades de navegadores, compactam código pra agilizar a carga da aplicação, otimizam o código pra que o mesmo não trave o navegador, corrigem erros de estruturais do JavaScript. Mesmo assim aplicações desenvolvidas nessas tecnologias sempre ficam um passo atrás das aplicações desktop, a interatividade é, quase sempre, mais crua que em um programa nativo do seu sistema operacional.

Isso acontece porque programar mecanismos de copiar/colar imagens, histórico de ações pra usar no desfazer (control + z), controle de arrastar e soltar vídeos, pode tomar muito tempo do desenvolvedor. O caminho mais prático a curto prazo é simplificar a aplicação, empobrecendo a experiência de interatividade do usuário pro velho modelo clica, espera, clica, espera. Mesmo que o “espera” seja esperar o AJAX e não a recarga da página, o modelo de interatividade é o mesmo: clicar, aguardar o servidor processar os dados e responder, clicar, aguardar…

A segunda geração de frameworks para desenvolvimento client-side

Alguns meses atrás Joel Spolsky usou a história dos aplicativos desktop pra profetizar o caminho do desenvolvimento de aplicativos rodando no navegador:

Então, se a história se repete, nós podemos esperar algum tipo de padronização de interfaces AJAX do mesmo jeito que tivemos com Microsoft Windows. Alguém vai escrever um Kit de Desenvolvimento de Software que você poderá usar pra criar aplicações AJAX com elementos de interface com usuário que funcionem entre as aplicações.

Joel Spolsky em Strategy Letter VI.

Tela de aplicação feita em SproutCore

A partir do segundo semestre de 2008 começam a surgir esses novos Kits de Desenvolvimento de Software. Objective-J, Cappuccino e SproutCore vêm pra mostrar que é possível ter aplicações ainda mais impressionantes que o Gmail ou o Meebo rodando no seu navegador, sem precisar instalar nada (nem plugin de Flash).

Com eles é possível fazer aplicações inteiras que rodam no navegador com pouca, ou nenhuma, interação com o servidor. Se o processamento pode acontecer na máquina do cliente, o servidor pode se preocupar apenas com o que só ele faz: consolidar e armazenar. Com isso toda a arquitetura de servidores e aplicações Web pode ser repensada, finalmente aproveitando, de verdade, o incrível poder de processamento dos computadores pessoais atuais, sejam eles Asus EEEs[bb], iPhones ou MacBooks e deixando pros servidores apenas o trabalho de consolidar dados de diferentes máquinas e armazená-los.

MobileMe, o novo produto Apple de integração de calendário, e-mail, contatos e fotos entre diferentes computadores, tem versões que rodam no navegador, é o Apple Mail, Address Book, iPhoto e iCal no seu Firefox, tudo feito com SproutCore.

Tela de Terminal com mensagens de Mongrel rodando aplicação SproutCore

Eu fiz alguns testes com SproutCore e fiquei impressionado. É como desenvolver uma aplicação Rails ou MERB: você cria projeto, models, views e controllers, roda o Mongrel como servidor de desenvolvimento na sua máquina, desenvolve a aplicação e depois faz o build, que gera apenas arquivos XHTML, JavaScript e CSS pra serem colocados no servidor. É JavaScript[bb] feito gente grande.

280 Slides é, até agora, o mais impressionante exemplo da nova leva de aplicações que está para surgir. Ele tem recursos como copiar/colar elementos gráficos, desfazer (control + z), renderização de imagens e elementos gráficos, tudo gerenciado pelo Objective-J, um framework JavaScript que imita o Objective-C, no qual são feitas as aplicações de Mac OS X. Veja uma apresentação de exemplo.

Abra o site do 280 Slides, clique em Try Now e experimente um pouco a aplicação, perceba como tudo funciona de modo macio, como se fosse uma aplicação desktop, mas rodando no navegador. Você não precisou instalar nada pra ter uma cópia do Apple Keynote rodando no seu Windows :)

Leitura recomendada:

No Mac OS X os programas não são janelas

Publicado em 2008-04-21, 29 comentários

Uma das principais diferenças pra quem migra de Windows ou Linux pra computadores Apple com Mac OS X[bb] é a diferença no conceito de janelas. No Windows, Gnome e KDE, o programa é uma janela. No Mac OS X, o programa pode ter uma ou mais janelas, ou não.

Acredito que este conceito é herança das idéias de Jef Raskin[bb] para o projeto Machintosh, onde a interface não teria janela alguma, e os aplicativos poderiam ser usados em qualquer lugar. Se eu quisesse usar os recursos de edição de foto enquanto edito um documento, poderia fazê-lo, assim como usar a calculadora no meio de um chat com um amigo, por exemplo.

No Mac OS X, os aplicativos podem ter janelas, mas se você fecha a janela, o progra ma continua rodando, normalmente. Quando eu abro o navegador Safari, automaticamente uma janela é exibida, se eu fecho esta janela o programa continua em execução. O mesmo para qualquer outro programa, como Mail, Address Book, Firefox.

Com isso você pode ter cliente de e-mail, torrents, musica, gerenciador P2P, instant messenger, dois navegadores Web e calculadora sem quem nenhum deles ocupe espaço na sua área de trabalho com janelas ou atalhos na barra de ferramentas.

A desvantagem é que se você não se cuidar, pode deixar muitos programas abertos e consumir toda a sua memória RAM com aplicativos que não estão sendo utilizados.

Eu particularmente gosto muito do modo como o OS X gerencia as janelas, me deixando livre pra ter vários aplicativos abertos sem que eles ocupem espaço na minha área de trabalho. Porém, já vi vários usuários pouco cuidadosos com Photoshop e Flash abertos sem necessidade, assim não tem 4 GB de RAM que aguente.

Gravei um vídeo que explica este conceito:

view video[bb]

boo-box agora é profissional

Publicado em 2007-07-30, 15 comentários

boo-box, uma nova dimensã de recomendações pessoais

Está no ar o novo boo-box. Nascido em 22 de janeiro, já conseguiu mudar minha vida.

Larguei o curso de Computação (Licenciatura) na Universidade de Brasília (a federal de lá), pedi demissão do meu cargo de Líder Técnico e mudei de Brasília pra Sampa em maio.

Sobre as novidades no boo-box, agora não tem mais dor pra inserir tags em seu conteúdo, com a extensão de Firefox (ou bookmarklet pra qualquer navegador) tudo fica 100 vezes mais rápido (sendo conservador). A instalação é feita com passo-a-passo, pra ajudar os não-nerds, o site está mais simples e mais objetivo. Espero que gostem, mandem as opiniões, e espalhem a notícia, por favor.

Timmy on Time, gerenciamento de projetos usando o Instant Messenger

Publicado em 2007-06-15, 15 comentários

Timmy on Time é um sistema de gerenciamento de projetos registro de tempo com uma abordagem absurdamente criativa, do tipo porque ninguém pensou nisso antes?, exatamente do tipo que eu gosto.

Você adiciona um contato na sua lista do Google Talk (ou qualquer instant messenger que rode na rede Jabber) e vai conversando com o robô que está do outro lado, você dá ordens e ele executa.

Abaixo o log do meu primeiro minuto de conversa com o robô:

  • Timmy:
    Looks like you’re a new user!
    Type REGISTER to register yourself to Timmy!
  • Marco:
    register
  • Timmy:
    You are now a user of Timmy!
    Type ‘CREATE PROJECT the project name’ to start a new project.
  • Marco:
    create project boo-box
  • Timmy:
    What’s the description of the project? (write ‘none’ to let it blank)
  • Marco:
    none
  • Timmy:
    I created a project named ‘boo-box’.
  • Marco:
    select project boo-box
  • Timmy:
    I set your current project to ‘boo-box’
  • Marco:
    create task remake the box layout
  • Timmy:
    I created and started a task named ‘remake the box layout’. Write ’stop’ when you’re done working on it.
  • Marco:
    stop
  • Timmy:
    stopped counting time for ‘remake the box layout’
  • Marco:
    register web
  • Timmy:
    To access your account on the Web, please follow this link : http://www.timmyontime.com/web/users/register?k=XXXXXXXXX (link editado pra você não destruir meu projeto =)

Pronto, se eu entro no site do Timmy on Time, vejo um relatório das minhas tarefas, projetos, tempos gastos nas tarefas. Simples, objetivo, e inovador.

Agora que esse tipo de abordagem surgiu, com certeza novas aplicações vão surgir usando esse conceito de ter o instant messenging como interface para aplicações… E alguém por aí disse que o futuro eram aplicações rodando no navegador Web, digo que o futuro são aplicações espalhadas de tudo quanto é jeito, até via telefone ou carta manuscrita ;)