Executando verificação de segurança...
2

[Dúvida] Como diminuir o bundle final da aplicação ?

Fala pessoal, blz ?

Acredito que em algum momento da carreira, vocês tenham enfrentado um problema para diminuir o bundle final do projeto após realizar um build pra produção.

Hoje trabalho em um projeto utilizando React (não utilizo Nextjs) no frontend e esse projeto já tem muitas funcionalidades e também muitas bibliotecas instaladas. Ultimamente, enfrentamos um problema grande no bundle final da aplicação, onde ficou com mais de 70MB de tamanho. Utilizei o webpack analizer para avaliar o que estava acontecendo e identifiquei alguns itens que estava prejudicando bastante o tamanho. Resolvi esses itens e consegui reduzir para 23MB. Mas acredito que ainda esteja muito grande, estive pesquisando alternativas como compactações, code split etc.

Já enfrentaram problemas parecidos ? E o que fizeram para resolver ?

Caso tenham alguma sugestão do que posso estudar para poder aplicar no projeto, podem me enviar.

Valeu!

2

esse projeto já tem muitas funcionalidades e também muitas bibliotecas instaladas

Bem vindo ao dependency hell, termo que ficou famoso no mundo Javascript.

Você instaloyu 5 libs no seu projeto, cada uma instalou mais 5, no final do cilho o package.json já consta com 1000 libs.

As únicas alternativas que vejo é usar alguma ferramenta de remoção de código inutilizado. Mas vai ser muito trabalho para pouca eficiência ou reduzir as bibliotecas que você usa

1

Exclui libs que não estavam sendo usadas, alterei a utilização de algumas usando recomendações da própria documentação pra não prejudicar no tamanho do bundle final. Ai chegou no ponto de ficar 23MB hahahaha

1