Estruturas JS pouco conhecidas, mas populares, para o frontend

Há pouco tempo, ao criar aplicativos da web dinâmicos, usamos JavaScript ou jQuery puro para trabalhar com o DOM. Desde então, muitas grandes estruturas e bibliotecas JavaScript surgiram. Eles ajudam a desenvolver projetos que, em atratividade e conveniência, superam o que eram antes. O autor do artigo, cuja tradução estamos publicando hoje, quer falar sobre várias estruturas e bibliotecas de clientes poderosas, porém pouco conhecidas, baseadas em JavaScript. Obviamente, os Três Grandes, representados por Angular , React e Vue , não foram a lugar nenhum, mas no mundo do desenvolvimento web, existem outras ferramentas dignas de atenção. Como Svelte , Preact e Riot



. A questão de escolher o remédio certo depende de muitos fatores. Entre eles estão o conhecimento do desenvolvedor, os recursos do projeto e a situação do mercado. Portanto, vejamos estruturas pouco conhecidas, expandindo a liberdade de escolha para quem procura a ferramenta certa para o seu próximo projeto.

Svelte



A estrutura Svelte é um novo representante das ferramentas de desenvolvimento front-end, cuja popularidade está crescendo constantemente recentemente. Eles falam sobre ele como um exemplo de uma abordagem completamente nova para criar interfaces de usuário. Comparado ao Vue ou React, que depende muito dos recursos do navegador para realizar seu trabalho, o Svelte funciona de maneira diferente. Ele, na fase de construção do projeto, envolve uma etapa de compilação, que contribui para melhorar o desempenho dos projetos baseados nele.

O Svelte visa não apenas a produtividade dos projetos finalizados, mas também a conveniência do desenvolvedor. Isso é alcançado reduzindo a necessidade de escrever grandes quantidades de código padrão.

Features Principais recursos


  • Desempenho impressionante
  • Pequenas construções
  • Disponibilidade
  • Sistema de encapsulamento de estilo padrão
  • Transições declarativas
  • DOM

Ember



Ember.js - Essa é outra excelente estrutura de cliente que acelera o desenvolvimento de aplicativos da Web, removendo a carga do desenvolvedor para executar ações padrão repetitivas. Ele permite que os programadores trabalhem com recursos avançados de JavaScript.

Essa estrutura possui uma maravilhosa ferramenta de linha de comando que acelera as tarefas de construção de projetos e seus testes, oferecendo suporte a um ambiente de desenvolvimento conveniente com recursos como o recarregamento automático de páginas. O Ember também possui um excelente roteador, cujas idéias inspiraram desenvolvedores de outros sistemas similares, por exemplo, o roteador React. A estrutura é muito produtiva devido ao uso de tecnologias que aceleram a renderização da página.

Os complementos do Ember fornecem ao desenvolvedor muitos plugins que permitem expandir os recursos dos aplicativos. O sistema Ember Concurrency, por exemplo, pode ser usado para escrever código assíncrono confiável. E o Simple Auth é um complemento que implementa muitos métodos de autenticação. A ferramenta Ember CLI Deploy permite implementar a lógica de implementação suportada que pode ser reutilizada.

Features Principais recursos


  • Pipeline de montagem de projeto padrão
  • O melhor sistema de roteamento entre ferramentas semelhantes
  • Ferramentas de dados avançadas
  • Sistema de teste em grande escala
  • Ciclo de liberação de seis semanas

Preact



A biblioteca Preact, como o próprio nome sugere, é muito semelhante ao React. É verdade que a biblioteca Preact é muito menor, seu tamanho é de apenas 3 KB. Mas essa biblioteca fornece ao desenvolvedor a mesma API moderna do React. O Preact fornece ao programador a implementação mais compacta de abstração DOM virtual, recursos estáveis ​​da plataforma e ferramentas de processamento de eventos. Esta biblioteca, sem uma etapa de transpilação, pode ser usada diretamente no navegador.

Além disso, o Preact é uma das bibliotecas cliente mais rápidas, caracterizada por tamanho modesto e alto desempenho.

Features Principais recursos


  • Suporte para classes ES6, ganchos e componentes funcionais
  • Suporte para JSX, DOM virtual, ferramentas de desenvolvedor
  • Suporte de renderização de servidor padrão
  • Suporte para navegadores modernos (IE11 +)

Tumulto



Riot é uma biblioteca de desenvolvimento de interface de usuário simples e elegante, baseada em componentes. Ele permite que você use elementos personalizados em todos os navegadores modernos sem a necessidade de polyfills. Esses componentes ajudam a combinar HTML e JavaScript para formar entidades adequadas para reutilização. A sintaxe do Riot é limpa e projetada para ser facilmente entendida pelo desenvolvedor.

O tamanho do Riot é de apenas 6 KB, ou seja, estamos falando de uma biblioteca muito compacta. Esta biblioteca suporta menos métodos de API do que suas contrapartes maiores. Isso sugere que, para o uso produtivo do Riot, o programador precisa dedicar pouco tempo ao treinamento.

Features Principais recursos


  • Alto desempenho e previsibilidade
  • Proximidade com os padrões da Web
  • Bom relacionamento com ferramentas de desenvolvimento
  • Sintaxe agradável
  • Alta velocidade de aprendizado
  • Tamanho modesto
  • Poderoso ecossistema modular

Aurelia



Aurelia é uma moderna estrutura JavaScript do lado do cliente para o desenvolvimento de aplicativos da Web, projetos para dispositivos móveis e computadores. Os aplicativos que usam Aurelia são criados montando componentes simples baseados em JavaScript puro ou TypeScript e o código HTML correspondente.

A estrutura do Aurelia possui excelente documentação, seus recursos são bem descritos nos tutoriais. Tudo isso ajuda aqueles que querem lidar com esse quadro e dominá-lo rapidamente. O Aurelia inclui um poderoso mecanismo a jato para implementar ligações, um sistema de modelos, um roteador e plugins. Aurelia suporta renderização de servidor e outros recursos avançados.


  • , ,

Mithril



O Mithril.js é uma estrutura JS moderna do lado do cliente projetada para o desenvolvimento de aplicativos Web de página única. É pequeno em tamanho (9,79 Kb), suporta roteamento e XHR.

É usado por empresas como Nike e Vimeo. Entre as tecnologias que ele suporta estão JSX, ES6 +, animação, teste.

Uma boa documentação foi preparada para essa estrutura, ajudando os iniciantes a descobrir rapidamente. Lá você pode encontrar exemplos nos quais é conveniente aprender os recursos do Mithril. É verdade que, em minha opinião, essa estrutura, em termos de documentação, fica atrás das outras ferramentas que examinamos aqui.

Features Principais recursos


  • Desempenho muito alto
  • Suporte DOM virtual
  • Suporte ao ciclo de vida do componente

Sumário


Espero que este material ilustre bem o fato de que a vida está além de Angular, Vue e React. Alguns projetos exigem abordagens e ferramentas diferentes daquelas que todos estão ouvindo. A escolha de uma ferramenta adequada depende muito dos recursos do projeto que você planeja criar com ela.

No final, quero dizer que, se você escolher um dos quadros incluídos nos "Três Grandes" para o seu projeto, definitivamente não se enganará. Angular é ótimo para o desenvolvimento de projetos em larga escala. Os front-ends angulares são frequentemente usados ​​em conjunto com os back-ends Java. React e Vue também são boas opções. Quero dar conselhos: não se torne fã de nenhuma estrutura ou biblioteca. Ao escolher uma ferramenta, tente abordar o processo de seleção com a mente aberta e encontre algo que atenda às necessidades do seu projeto.

Queridos leitores! Você usa estruturas ou bibliotecas que não estão incluídas nos Três Grandes?


All Articles