Esse projeto contém um site simples, com vários recursos visuais e já vem configurado para otimização de performance utilizando vários plugins do automatizador de tarefas Gulp.
- Gulp
- Gulp Clean
- Gulp Concat
- Gulp Imagemin
- Gulp Cssmin
- Gulp Htmlmin
- Gulp Usemin
- Gulp Uglify
- BrowserSync
- Sass
- Node Sass
Execute o comando npm install
Execute o comando npm run serve.
Acesse o endereço local: http://localhost:3000 para navegar pelo site. O navegador irá atualizar a página à cada vez que for salvo um arquivo na pasta src
Execute o comando npm run build.
Será gerada uma pasta distcom os arquivos prontos para serem publicados em um servidor web.
Os arquivos estarão otimizados com a redução do peso e unificação de alguns scripts e CSS.
Execute o comando docker-compose -f "docker-compose.yml" up -d --build para subir o container com a aplicação original e também na versão otimizada para então fazer as comparações do resultado final.
- Site Otimizado - (http://localhost:8080)[http://localhost:8080]
- Site Original não otimizado - (http://localhost:8080)[http://localhost:8082]
- aplicar sprites nas imagens
- aplicar versionamento nos assets (Gulp Rev)
- ativar Gzip no servidor: ok
- ativar cache-control no servidor para os assets
- paralelizar requests servindo assets em domínios/subdomínios diferentes : ok (URL de imagens vindo do servidor http://localhost:8081)
https://www.webpagetest.org/result/210613_AiDcE5_4373e7fbe5ef95e20921ffff0664563a/
