Ainda não tem acesso? Estude com a gente! Matricule-se
Ainda não tem acesso? Estude com a gente! Matricule-se

Solucionado (ver solução)

Carregamento dinâmico e split de código

Alguém tem feito uso de carregamento dinâmico de código/split de código, onde se faz o carregamento minimo necessário para o funcionamento da pagina e conforme o usuário vai interagindo seria feito o carregamento assíncrono dinamicamente do código para as partes que o usuário interage?

Alguém tem algum conteúdo sobre? seja livro, blog post, vídeo? Se tiver experiencia com isso também pode falar um pouco sobre aplicabilidade disso em um projeto?

vlw!

3 respostas

Fala aí Herminio, tudo bem? Bom, não entendi se seria algo exclusivamente do Webpack ou sobre projeto.

Eu já trabalhei em projetos Angular e React, ambos com carregamentos lazy. No meu blog tenho um post falando sobre:

https://blog.matheuscastiglioni.com.br/code-splitting-e-lazy-loading-no-react/

Recentemente meu projeto atual no trabalho estamos também trabalhando com lazy loading e temos gostado bastante do resultado/performance.

Espero ter ajudado.

Opa Matheus, tudo bem e contigo?

Então notei aqui que a minha pergunta foi bastante genérica, mas, sim de fato eu gostaria de saber tanto o uso com o webpack fazendo esse gerenciamento e os impactos e benefícios que isso traz ao projeto... vou ver aqui o seu blog post!

Falando sobre esse assunto no âmbito de projeto, pode mostrar alguns desses resultados de antes e depois, como o tradeoff de mudar para essa nova abordagem e afins...

vlw!!!

solução

Tudo em ordem também, vamos lá:

  • Impactos:

Em alguns projetos pode haver uma grande necessidade de refatoração e configuração, pois, isso vai mudar a maneira como as importação e carregamentos estão sendo feitos.

  • Benefícios:

Separar os códigos em pequenas partes ai garantir uma maior performance do projeto, irá consumir menos banda de internet do usuário, trafegar menos informações na rede.

  • Tradeoff:

Mas, nem tudo são flores, em alguns momentos pode ser que não seja aconselhável essa separação.

Uma vez que a gente baixou tudo, a aplicação irá funcionar normalmente, a mudança de telas acontecerá mais rápido.

Quando separados em pequenos pedaços, o primeiro carregamento será mais rápido, mas, as mudanças de telas irão ter a necessidade de baixar os arquivos correspondentes para aquele novo pedaço, sendo assim, será necessário adicionar loaders ou algum indicador visual para o usuário.

As vezes pode trazer uma complexidade maior para o projeto também.

Cabe a vocês (time) definir se faz sentido ou não e onde faz sentido ou não faz.

  • Mostrar resultados:

Infelizmente não posso, são projetos internos do meu trabalho e não posso mostrar.

Mas já pegamos páginas de 13MB de download e baixamos para 3MB, por exemplo.

Espero ter ajudado.