Projeto de criação de uma LANDING PAGE para a empresa BelaBelinda
A Bela Belinda, maior empresa do segmento APLIQUES no Brasil, está com problemas no carregamento de suas landing pages, que são as maiores responsáveis pelo trafêgo de usuários no site principal. Está é uma das landing pages atuais(BelaBelinda),que foi usada de exemplo para comparações nesse texto.
Desenvolvemos uma nova versão da landingpage usando Gatsby, segue abaixo algumas informações sobre as melhorias.
Informações tiradas do site PageSpeedInsights > - By Google
- A nota da página subiu de 6 para 84 pontos.
- O tempo que o primeiro conteúdo é pintado na tela caiu de 7.5s para 3.1s.
- O índice de velocidade foi de 16.9s de lentidão para 3.1s.
- O tempo que a página leva para ficar completamente interativa caiu de 37.3s para 4.4s.
Segue abaixo prints comparativos da página que não foi feita com Gatsby e a que foi feita:
| PageSpeedTest WordpressLike | PageSpeedTest Gatsby |
|---|---|
 |
 |
OBS: Recomendo dar uma lida sobre Gatsby antes de mergulhar direto no projeto. No final deste documento tem um link para Quick Start do GatbsyJS.
Para rodar o projeto localmente, após clonar esse repositório, você deve entrar na pasta raiz do projeto e rodar os comandos:
Instalar as bibliotecas & dependências do projeto: yarn install
Subir um servidor local: gatsby develop