Firefox 3.5 Beta 4 executa Javascript mais rápido ainda

Primeiro devo admitir, dei uma sumida, caiu o número de posts aqui, mas tá dificil conseguir tempo, ultimamente, além do trabalho, estou fazendo freela e estudando e meio sem criatividade pra postar, espero que seja breve.

No post de hoje vou falar sobre duas coisas que me ajudam muito na minha profissão, Firefox e Javascript.

Ontem ví uma notícia, que a versão 3.5 Beta 4 do Firefox (que está demorando um tantão pra ser lançada), tem um algoritmo que executa Javascript 19% mais rápido do que a versão Beta 3, esta que também já é mais rápida que a versão atual do Firefox. Isso é bom pra quem é programador de interface, e principalmente pro usuário.

Comecei a usar o Firefox em meados de 2005, achei legal porque “tinha abas”. Na época eu era programador back end, e como a maioria, pouco me importava se meus sites rodavam em outro browser ou não. De lá pra cá eu, as empresas, as agências, os clientes, os navegadores, os sites e até os usuários mudaram. Hoje temos (todos nós) o conceito de webstandards muito forte, e hoje os próprios usuários também são mais exigentes… normalmente temos diversas opções pra qualquer tipo de serviço web, então se um site não funcionou no navegador do usuário, ele não muda de navegador, muda de site… procura por outro serviço que faz a mesma coisa, é claro que não serve pra tudo (como sites de bancos, malditos).

Comecei a programar em Javascript pois detestava sites em flash, e comecei a ver que em algumas aplicações simples, dava pra fazer o mesmo efeito em Javascript.

E depois, quando “descobri” o firebug, ficou tudo mais fácil.

Mais uma vez o Firefox contribui diretamente e incentiva o uso de Firefox pra desenvolvimento de interação.

Além do mais, até nas extensões do Firefox (como GreaseMonkey e Ubiquity) é possível fazer coisas muito interessantes usando somente javascript.

Enfim, usem firefox… =)

[]s

Contador de caracteres para Firefox Ubiquity

Mais um comando básico pra quem usa ubiquity. Esse conta quantos caracteres tem um texto. Pode digitar um texto ou selecionar e usar o this do ubiquity. O Fabricio Teixeira do blog arquitetura de informação que pediu e não foi trabalho nenhum fazer.
=)

O resultado foi esse:

contador de caracteres para firefox ubiquity

Para adicionar o commando, considerando que já tenha o ubiquity instalado, é claro, é só clicar no botão “Subscribe” a direita dessa barrinha que apareceu no canto superior do seu firefox :

Em seguida é só confirmar na tela abaixo:

E pronto, reinicie o firefox, aperte ctrl + espaço e digite chars para chamar a função.

Como fazer um comando ou plugin para o firefox ubiquity

Pra quem instalou o ubiquity, nesse post vou ensinar como se faz um plugin simples de busca num site (no caso nosso blog).

Plugin de Busca no Tidbits para Firefox Ubiquity

E na verdade é bem simples. Abra o ubiquity e digite command-editor.

Copie e colo o código lá. O código todo é esse:

CmdUtils.CreateCommand({
  name: "tidbits",
  author: {name: "Danilo Augusto", email: "[email protected]"},
  description: "Buscar no tidbits.com.br",
  homepage: "http://www.tidbits.com.br/",
  takes: {"Digite o que deseja procurar no www.tidbits.com.br": noun_arb_text},
  preview: function(pblock, q) {
    pblock.style.backgroundColor = '#ff0';
    pblock.style.color = '#000';  
    if(q.text==''){
      pblock.innerHTML = 'Digite o que deseja procurar no www.tidbits.com.br';
	} else {
      pblock.innerHTML = 'Procurar por "'+q.text+'" no www.tidbits.com.br';
    }
  },
  execute: function (q) {
    var url = "http://www.tidbits.com.br/?s=" + q.text;
    Utils.openUrlInBrowser (url);
  }
});

Explicando linha a linha :

1 – Cria o comendo
2 – nome do comando (o que vc vai digitar no ubiquity para chamar a função que você está criando).
3, 4 e 5 – Descrição.
6 – O que aparece no ubiquity explicando como o usuário deve usar o comando.
7 a 15 – Abre o preview. O preview é a caixa roxa do ubiquity (nesse caso amarela) onde é escrito algum comentário. Para alterar ele é simples, funciona como um objeto DOM para o javascript ( pblock ), nele vc pode colocar dhtml comum como
pblock.innerHTML = ‘teste’;
pblock.style.minHeight = ‘400px’
ou como fiz no exemplo :
pblock.style.backgroundColor = ‘#ff0’;
pblock.style.color = ‘#000’;

e o “q” é o objeto que guarda o valor que o usuário digitou (usando q.text).

16 – abre o bloco de execução do comando (o que vai fazer quando o usuário apertar enter).
17 – declarei uma váriavel dizendo a url que desejo abrir.
18 – abre uma url.
19 – encerra bloco de execução.
20 – encerra o comando.

Para exportar o comando para seu site é simples, coloque o código dentro de um arquivo .js

e dentro do head do seu site coloque o seguinte comando:

<link rel="commands" href="ubiquity.js" name="Busca no meu site" />

Fazendo assim, para adicionar o commando, considerando que já tenha o ubiquity instalado, é claro, é só clicar no botão “Subscribe” a direita dessa barrinha que apareceu no canto superior do seu firefox :

Confirmar instalação do comando

Em seguida é só confirmar na tela abaixo:

Tela de concordo com os termos abaixo

Pronto, reinicie o firefox, aperte ctrl + espaço e digite tidbits (o nome do comando ) para chamar a função.

Além desse, eu já tinha feito anteriormente um comando pra gerar Lorem Ipsum.

Mais documentação sobre como criar comandos para o ubiquity pode ser encontrada aqui.

Gerador de Lorem Ipsum para Ubiquity

A pedido da Belinha (e uma boa dose de insistência da parte dela), programei um comando de lorem ipsum para o ubiquity da Mozilla.

O resultado foi esse:
gerador de lorem ipsum para ubiquity -firefox

Para adicionar o commando, considerando que já tenha o ubiquity instalado, é claro, é só clicar no botão “Subscribe” a direita dessa barrinha que apareceu no canto superior do seu firefox :

Em seguida é só confirmar na tela abaixo:

e pronto, reinicie o firefox, aperte ctrl + espaço e digite lorem para chamar a função.