Weblosofia com CSS, Jquery, Javascript, Ajax, PHP etc.
por Alexandre Magno
Postado em Agosto 06th, 2007 por Alexandre Magno
Frameworks Js, Weblosofia, Jquery
Existe atualmente várias Frameworks Javascript e todas tem o mesmo objetivo: aumentar a simplicidade e a produtividade desta linguagem. Então qual seria a melhor? Qual alcança mais estes objetivos? Com certeza há muita discussão sobre isto e para alguns uma certa framework javascript é como um time de futebol ou até uma religião. Elas não vieram para disputar umas com as outras, mas sim para dar uma liberdade de escolha para os usuários.
Escolhi o Jquery de maneira intuitiva. Conheci primeiro o Mootools, achei bastante interessante, mas ao ler a documentação não me senti a vontade. Depois com o rails acabei encontrando o script.aculo.us e comecei a "brincar" com algumas funcionalidades, mas ainda faltava alguma coisa. Depois veio o Prototype quando fui trabalhar com o cakePHP. Com poucos dias pude perceber o poder desta framework. Então descobri que ela estava sendo muito usada e respeitada na comunindade de desenvolvedores. No entanto, no primeiro dia de encontro com o Jquery, já estava fazendo muita coisa, principalmente com o Ajax. É muito conciso o fato de que no final das contas nada de Javascript é inserido no HTML. Mas isto é minha opinião, mas ela não é válida quando o que vale no mundo do desenvolvimento web é a prátia e vivências de diferentes plataformas.
Procurando por várias comparações na Web vou mostrar neste post a diferença entre o Jquery e Prototype, que julgo serem as mais sólidas da Web.
Acho que esta citação de Michael Futreal resume bem a diferença das duas:
Prototype torna o Javascript interessante, é uma ótima framework, é útil e boa de usar. O Jquery é divertido. Ele permite que você selecione os objetos DOM da página com seletores CSS3 mesmo que os browsers não o suportem. Por ele você navega pelo DOM como um livro muito bem escrito
Esta é uma boa diferença. Mas e isto em códigos?
Vou começar a ilustrar um Javascript comum que é utilizado no dia a dia: Tabela com cores alternadas. Assim ficará fácil perceber como é útil o uso de seletores CSS3.
Com o Prototype:
$$("table").each(function(table){ Selector.findChildElements(table, ["tr"]) .findAll(function(row,i){ return i % 2 == 1; }) .invoke("addClassName", "odd"); });
E agora com o Jquery:
$("tr:nth-child(odd)").addClass("odd");
Agora me pergunte qual seria mais simples e intuitivo? Qual você prefere ficar?
Vamos ilustrar mais uma funcionalidade das duas Frameworks: Adicionar Classes dinâmicamente em vários elementos.
Abaixo o código com o Prototype:
$$('.element').each(function(node) { Element.addClassName(node, 'className'); }
Com o Jquery:
$('.element').addClass('className');
Como está descrito no Blog do Jquery , o último código é um exemplo claro da diferença de metodologias. Pelo fato do Jquery está passando mensagens para objetos Jquery, o código possui uma sutil mudança. O Jquery não importa se você está adicionando uma classe em um grupo de objetos ao invés de um objeto. O código para ambas as situações é o mesmo. Prototype, por outro lado, requer um iterador(No caso o each que percorre todos os objetos selecionados).
Na medida que seu código fica mais complexo, a escabilidade do Jquery se torna mais fácil, enquanto que loops aninhados se tornam normas em frameworks como Prototype.
A seleção de objetos utilizando o X-path e o CSS3 tornou-se algo tão útil, que a versão do Prototype depois da 1.5 já aceitava essa característica.
Há muitos rumores de que o Jquery seja bem mais lento que o prototype, mas testes foram realizados e pode-se contatar que não é bem assim. A diferença entra na parte da filosofia. Resumindo estes conceitos, para o Jquery:
Bem, acho inevitável qualquer desenvolvedor Javascript fazer o uso de uma framework. Para quem ainda não sabe qual usar, vale a pena dar uma olhada no Jquery. Para quem usa o Prototype, nada contra, pois acho que cada Framework se encaixa para um certo desenvolvedor. Eu me dei bem com o Jquery, outros podem gostar do Prototype e achá-lo bem mais simples e intuitivo. Mas tentei mostrar aqui as diferenças e uma comparação entre as duas e o que me levou a fazer esta escolha. O desenvolvimento de Plugins e a seleção por CSS 3 é um diferencial.
Artigos relacionados
Micox comentou:
31st Agosto, 2007 às 8:51 am
Eu mexo com jquery e nunca experimentei outro framework. Sempre tive vontade de ver outro tipo este mais famoso aí chamado prototype.
Porém, agora depois deste artigo perdi a vontade. Nem compensa. É muuuito complicado com relação ao ótimo jquery.
Valeus ![]()
admin comentou:
31st Agosto, 2007 às 12:49 pm
É, com certeza, a framework existe para aumentar a produtividade e precisa ser simples, porém concisa. O jQuery conseguiu unir as duas coisas e vem cada vez mais melhorando suas capacidades e funcionalidades.
Aê micox, você me deu uma dica de como pegar os campos dos formulários no form usando o plugin para poder fazer o uso do Ajax com mais flexibilidade, andei aprofundando no plugin, ele realmente é a solução, perfeito. Obrigado cara e logo quero postar aqui por que muita gente tem essa dúvida!!!
Fernando comentou:
6th Setembro, 2007 às 5:07 pm
Você sabe se consigo trabalhar com os dois ao mesmo tempo ? digo isso por que o scrptaculous precisa da Prototype, mas gostaria de usar a JQuery nas outras partes de desenvolvimento.
Abraço
admin comentou:
6th Setembro, 2007 às 5:38 pm
Boa tarde Fernando, nunca utilizei as duas, mas é uma boa pergunta, pois utilizo o cakpePHP que usa o scriptaculous e uso o jQuery, acho que o prototype tem uma variavel chamada $event que tem conflito com o jquery como o mootools, dá uma olhada no post e tente mudar o nome da variável se ela apresentar conflito, você fica sabendo pelo firebug. Se acontecer, use as instruções como coloquei no posto sobre o Mootools, de qualquer forma vou testar e ver se acontece o conflito. Abraços…
Nagib comentou:
1st Outubro, 2007 às 11:18 am
Bom dia…
Eu trabalho com o Prototype desde as versões mais antigas, e nunca tive vontade de trabalhar com outra. Pelo que eu conheco do jQuery eu acho que o Prototype é mais fácil de ser alterado. Aprendi muito utilizando e alterando o Prototype.
admin comentou:
1st Outubro, 2007 às 1:41 pm
Mas é isso aí Nagib, cada um se sente melhor com alguma framework, eu não tenho nada contra nenhuma delas, este post foi só para ilustrar algumas diferenças significativas… para quem quer aprender alguma e não sabe qual escolher, o que resta é experimentar… todas tem o mesmo objetivo, o que muda é como ele é atingido!!!
Issamu comentou:
26th Março, 2008 às 3:11 pm
Olá, para responder a dúvida dos colegas que perguntaram de como utilizar prototype jQuery juntos, vc pode utilizar o jQuery.noConflict(); e depois de chamar isso, vc tem as chamadas ao jquery utilizando o jQuery ao invés do $. exemplo:
jQuery.noConflict();
// Use jQuery via jQuery(…)
jQuery(document).ready(function(){
jQuery(”div”).hide();
});
// Use Prototype with $(…), etc.
$(’someid’).style.display = ‘none’;
se quiser saber mais sobre o jQuery.noConflit() e compatibilidade entre o jQuery e outras bibliotecas: http://docs.jquery.com/Using_jQuery_with_Other_Libraries
http://docs.jquery.com/Core/jQuery.noConflict
abraços
Os seguintes campos estão incorretos ou faltando