jQuery: Uma reflexão para os devs modinhas!

Eu entendo a adoção e massificação do uso dos frameworks, principalmente por parte das empresas que buscam padronizar a forma de desenvolver suas soluções e de alguma forma acelerar a integração de um novo desenvolvedor na equipe, seja por crescimento da mesmo, seja por rotatividade dentro da empresa. Dessa forma, a parte da tecnologia usada acaba sendo uma barreira menor, onde o dev acaba focando em entender o negócio em si!

O que eu não entendo é a demonização que alguns devs modinhas acabam fazendo sobre algumas tecnologias, que apesar de não estarem nos holofotes, ainda sim continuam relevantes para o mercado. Pensando nisso, resolvi apresentar meu ponto de vista comparando os frameworks modernos para desenvolvimento web vs a biblioteca javascript mais utilizada do mundo, mesmo nos dias de hoje. Estou falando do jQuery, que segundo a W3Techs, que cria relatórios estatísticos do uso das tecnologias no mercado de TI, apresentou que o jQuery na versão 3, por exemplo, é usado por 72,5% de todos os sites na web que usam alguma biblioteca js.

O desenvolvimento web moderno é marcado pela ascensão de frameworks JavaScript como React, Angular e Vue.js, que prometem revolucionar a forma como construímos aplicações. No entanto, em meio a essa onda de inovação, o jQuery persiste como uma força dominante, presente em mais de 70% dos sites da web, segundo dados do W3Techs. Este artigo explora essa dualidade, comparando frameworks modernos e jQuery, e ainda mostro uma função no jQuery que pode transformar esse clássico esse clássico algo atual, pois como sabe-se, um clássico nunca sai de moda!!!

Frameworks Modernos: A Promessa da Arquitetura de Componentes

Frameworks como React, Angular e Vue.js introduziram um paradigma de desenvolvimento baseado em componentes reutilizáveis, gerenciamento de estado eficiente e roteamento integrado. Essa abordagem facilita a criação de aplicações complexas e escaláveis, com código organizado e de fácil manutenção.

Vantagens dos Frameworks Modernos:

• Arquitetura de Componentes: Reutilização de código e modularidade.
• Gerenciamento de Estado: Controle eficiente dos dados da aplicação.
• Roteamento Integrado: Criação de SPAs com navegação fluida.
• Comunidade e Ecossistema: Vasto suporte e recursos.
• Desempenho Otimizado: Técnicas como o DOM virtual.

Desvantagens dos Frameworks Modernos:

• Curva de Aprendizado: Exigem tempo para domínio.
• Complexidade: Podem ser excessivos para projetos simples.
• Tamanho do Pacote: Podem aumentar o tamanho da aplicação.

jQuery: A Simplicidade e a Onipresença

jQuery, por outro lado, se destaca pela simplicidade na manipulação do DOM, animações e requisições AJAX. Sua sintaxe concisa e compatibilidade com diversos navegadores o tornaram uma ferramenta essencial por muitos anos, e ainda hoje, domina a web.

Vantagens do jQuery:

• Simplicidade: Facilidade na manipulação do DOM.
• Compatibilidade: Funcionamento em diversos navegadores.
• Curva de Aprendizado Suave: Fácil de aprender e usar.
• Tamanho do Pacote: Menor em comparação com frameworks.
• Onipresença: Presente em grande parte dos sites da web.

Desvantagens do jQuery:

• Manipulação Direta do DOM: Pode impactar o desempenho em aplicações complexas.
• Falta de Estrutura: Limitado para aplicações escaláveis.
• Gerenciamento de Estado Limitado: Dificulta o controle de dados.
• Menor Comunidade: Em comparação com frameworks modernos.

jQuery e as Tendências Modernas: Roteamento e Componentes

Apesar da ascensão dos frameworks, o jQuery não precisa ser relegado ao passado. É possível adaptar o clássico às tendências modernas, utilizando a função load() para criar uma estrutura de roteamento e carregar partes do código como se fossem componentes.

Exemplo de Roteamento com jQuery:

JavaScript

$(document).ready(function() {
function carregarPagina(url) {
  $('#conteudo').load(url);
}

$('#link-home').click(function() {
  carregarPagina('home.html');
});

$('#link-sobre').click(function() {
  carregarPagina('sobre.html');
});
});

Neste exemplo, a função carregarPagina() utiliza load() para carregar o conteúdo de diferentes páginas HTML dentro da div #conteudo, simulando um roteamento básico.

Exemplo de Componentes com jQuery:

JavaScript

function criarComponente(url, elemento) {
$(elemento).load(url);
}

criarComponente('componente-header.html', '#header');
criarComponente('componente-footer.html', '#footer');

Aqui, a função criarComponente() carrega partes do HTML (como header e footer) em elementos específicos, simulando a reutilização de componentes.

Claro que pode ser mais elaborado, e sim, criar uma estrutura parecida com algum framework para padronizar o desenvolvimento e que vai depender do nível e habilidades técnicas do dev, mas, como eu disse, um clássico nunca sai de moda!!!

Conclusão

Apesar da evolução dos frameworks, o jQuery se mantém relevante no mercado, presente em grande parte da web. Sua simplicidade e onipresença o tornam uma ferramenta valiosa, especialmente para projetos simples e para aqueles que buscam compatibilidade com navegadores antigos. Além disso, é possível adaptar o jQuery às tendências modernas, utilizando técnicas como roteamento e componentes, demonstrando que o clássico ainda tem muito a oferecer.