DEV Community

Cover image for Por que Web Components?
Rafael Firmino
Rafael Firmino

Posted on • Updated on

Por que Web Components?

Fala dev, não sei como chegou aqui, mas este é o meu primeiro post na plataforma então vou me apresentar dessa vez.

Me chamo Rafael, sou apaixonado por desenvolvimento de software, atualmente trabalho como analista em uma plataforma a nível global. Me Viro no devops(Azure, aws, docker, jenkins), RabbitMq, lerna, elastic search, goFiber, docker-compose, Js, css, Vuejs, stencil...

Nos ultimos 2 anos eu tenho trabalhado bastante utilizando vuejs e sem sombra de dúvidas é uma ferramenta incrível!
No projeto atual nós temos a necessidade de utilizar grandes plugins pagos, como Aggrid, flexmonstrer, highcharts e outros grátis como vis-timeline, select2, sweetalert2.

Nem tudo são flores e no desenvolvimento de software o problema e no mundo de components também não. Um dos problemas começa quando o time, tendência ou falta de tempo nos forçam a utilizar wrappers. wrappers ou adapters são utilizados para criar uma camada de abstração entre o framework e a library que deseja utilizar.

O problema desse wrapper é que ele nem sempre acompanha as versões da biblioteca. Um exemplo claro de um é o vis-timeline que atualmente a lib está 10 versões a frente do wrapper. A mesma coisa ocorre com aggrid, Flexmonster e Hightcharts.

Não precisaríamos pensar em utilizar wrappers se as bibliotecas fossem realmente agnósticas a framework. Já precisou customizar alguma lib em um framework vue, react ou svelt. As vezes é mais complicado do que parece e "gambiarras" para adicionar comportamentos surgem nesse momento.

Recentemente estive pensando bastante como criar componentes realmente customizáveis e principalmente reutilizáveis independente de framework, foi onde me deparei com um carinha chamado Stencil.

Stencil é um conjunto de ferramentas para a construção de sistemas de design reutilizáveis ​​e escaláveis. Gere componentes da Web pequenos, extremamente rápidos e 100% baseados em padrões que são executados em todos os navegadores.

Alt Text

Penso que Web Components é o caminho para criarmos bibliotecas de qualidade, agnósticas, testáveis, com os seus comportamentos isolados, CUSTOMIZÁVEIS e REUTILIZÁVEIS.

Estou criando um Web Component chamado componentt-toast Tem muita coisa ainda a ser feita mas já da pra pegar a ideia e ver o quão fácil é o Stencil. Sinta-se livre para contribuir.

Obrigado :)

Discussion (0)