Tornar o site rápido em um celular e em uma conexão lenta
Ajudar os visitantes a ver e usar as partes importantes rapidamente, mesmo em um celular comum ou em uma conexão instável.
Quando usar
Antes do lançamento, após adicionar muitas imagens ou widgets, ou quando o site parece bom no computador, mas lento em um celular.
Antes de começar
- Um site com conteúdo real e imagens representativas; testes apenas com espaços reservados podem esconder o problema real.
- A página ou duas que os clientes precisam conseguir usar rapidamente.
- Um celular para a verificação humana final, idealmente uma vez no Wi-Fi e uma vez em uma conexão móvel mais lenta.
- Uma lista de widgets de terceiros que você precisa manter, como mapas, vídeo, chat, análise ou ferramentas de agendamento.
O prompt
Esses prompts funcionam melhor em inglês — cole-os como estão, mesmo em páginas traduzidas.
Review the whole site for a visitor using a narrow phone screen and a slow connection. Improve speed without removing essential content, changing the brand or redesigning the pages. Start by testing the home page and [MOST IMPORTANT CUSTOMER PAGE] at a phone size with a simulated slow connection. Give me a short before list of what makes the visitor wait, what moves around while loading, and what cannot be controlled from inside this app. Then make the first visible section useful as soon as possible. Resize and compress images without making them visibly poor, use the right image size for the visitor's screen, and delay images and heavy sections below the first screen until the visitor approaches them. Do not delay the main image or content needed in the first screen. Remove only extra code, fonts, animations and repeated files that are genuinely unused. Keep form submission, visitor tracking, payments and other working connections intact. Load non-essential third-party widgets, which are tools supplied by another service such as a map or chat box, after the main content. Show a clear fallback if a map, video or other external tool fails. Reserve the correct space for images and cards before they load so buttons and text do not jump. Keep buttons responsive while background work finishes, and show a simple loading or error message instead of a blank screen. The style should remain [CURRENT BRAND FEELING]. After the changes, repeat the same phone and slow-connection test, compare it with the before list in plain language, and tell me which remaining delays come from services outside my control.
Já está criando? Cole isto no seu projeto. Começando do zero? Abra uma conta gratuita em um criador compatível abaixo.
Crie em
O que isto cria
- Uma revisão de velocidade em linguagem simples com comparativo antes e depois
- Imagens melhor redimensionadas e compactadas para diferentes telas
- Carregamento de conteúdo inicial mais rápido e seções não essenciais adiadas
- Espaçamento estável na página enquanto imagens e cartões carregam
- Alternativas claras para widgets externos lentos ou que falharem
Confira se funcionou
Cole o prompt, espere a construção terminar e então confirme estes pontos — em linguagem simples, sem verificações técnicas:
- No seu celular, o texto útil e a ação principal aparecem antes que cada imagem da parte inferior da página termine de carregar
- O menu e o botão principal respondem enquanto as seções mais lentas ainda estão carregando
- O texto e os botões não saltam para um lugar diferente à medida que as imagens aparecem
- As imagens ainda parecem nitidamente aceitáveis e não ficam esticadas
- Em um teste propositalmente lento, a página exibe uma mensagem útil de carregamento ou erro em vez de ficar em branco
- Seus formulários, pagamentos, rastreamento de visitantes e outras conexões necessárias continuam funcionando após as mudanças de velocidade
Faltou algo? É normal — peça em uma mensagem curta de acompanhamento em vez de rodar o prompt inteiro de novo.
Próximos passos
Corrija a página mais pesada primeiro
Quando uma galeria, menu ou página de catálogo ainda estiver visivelmente mais lenta
Focus only on [PAGE NAME]. Identify its three biggest causes of waiting, fix the ones this app controls, and keep [ESSENTIAL FEATURE OR IMAGE QUALITY] intact. Do not change other pages. Repeat the same slow-phone test and explain the difference in plain language.
Você saberá que funcionou quando: A página escolhida torna-se utilizável mais cedo sem perder seu conteúdo essencial.
Torne um widget pesado opcional
Quando um mapa, vídeo, chat ou ferramenta incorporada atrasa a primeira visualização
Replace the automatic loading of [WIDGET] with a lightweight preview and a clear [BUTTON LABEL] button. Load the real widget only after the visitor chooses it. If loading fails, show [FALLBACK INFORMATION OR LINK] instead of a blank space.
Você saberá que funcionou quando: A página carrega sem esperar pelo widget, que ainda pode ser aberto quando solicitado.
Evite regressões de velocidade
Depois que o site estiver rápido o suficiente
Add a repeatable performance check for the home page and [IMPORTANT PAGE] at a phone size. Flag newly added images that are unnecessarily large, layout that jumps while loading, and third-party scripts that delay the main content. Give me a short checklist to run after future changes.
Você saberá que funcionou quando: Você terá uma verificação simples que detecta lentidões comuns antes da publicação.
Fique atento a
- A imagem principal não deve ser adiada. Carregar a imagem da primeira tela tardiamente pode fazer o site parecer mais lento. Adie apenas o conteúdo que começa abaixo da primeira tela.
- A compactação pode destruir detalhes importantes. Fotógrafos, lojas e empresas de alimentos devem comparar imagens-chave nos tamanhos de celular e desktop antes de aceitar arquivos menores.
- Widgets de terceiros podem dominar o tempo de espera. Um mapa pesado, caixa de chat ou vídeo pode continuar lento mesmo após o resto ser corrigido. Adie-o, mostre um espaço reservado ou remova-o se não estiver compensando o custo.
- Sua visita de retorno pode parecer mais rápida que a primeira visita de um cliente. Teste em uma janela privada ou com o navegador limpo para que os arquivos salvos não escondam a experiência real da primeira vez.
- Mudanças de desempenho podem quebrar dependências silenciosas. Teste novamente formulários, pagamentos, rastreamento de visitantes e login em vez de presumir que uma página mais rápida ainda faz tudo.
Notas por plataforma
Todas as três plataformas principais podem otimizar as páginas e arquivos que seu aplicativo controla, mas nenhuma pode tornar a rede do visitante ou um widget de terceiros lento mais rápido. A pesquisa de site publicado e a revisão de desempenho do Lovable podem confirmar problemas comuns. A configuração padrão de aplicativo do v0 possui ferramentas robustas de imagem, fonte e carregamento quando configuradas corretamente. O Base44 gerencia o sistema que publica o aplicativo, então foque em suas imagens, estrutura de página e conexões, e peça para que ele indique qualquer coisa que a plataforma gerenciada não permita alterar.
Gaste menos créditos
Toda plataforma cobra pelo trabalho que a IA dela faz — então o hábito mais barato é pensar antes de construir. Estas seis regras cortam a maior parte do desperdício, qualquer que seja a plataforma.
- Planeje primeiro em um chat gratuito. Esboce tudo no ChatGPT, Claude ou Gemini — páginas, recursos, o que cada formulário coleta, como deve ficar. Pensar lá é grátis; pensar dentro de um builder é cobrado.
- Comece com um prompt escrito, não com uma frase. "Faça um site para mim" é a frase mais cara na construção com IA. Um primeiro prompt completo — como os deste site — economiza dezenas de rodadas de correção.
- Não tenha preguiça dos detalhes. Cada detalhe omitido volta como uma correção que você paga. Nome do negócio, cores, cada página, cada campo de formulário, o que acontece após o envio — coloque tudo no primeiro prompt.
- Depois, uma mudança por mensagem. "Arrume o cabeçalho, e o formulário, e as cores" gera um emaranhado que custa mais para desfazer do que economizou.
- Travou? Pare de remendar. Se a mesma correção falhar umas três vezes, não mande uma quarta — descreva o estado final desejado da seção inteira em uma mensagem nova.
- Comece grátis. Faça upgrade quando precisar de mais. Use a cota gratuita para criar e explorar sua primeira versão. Faça upgrade quando precisar de mais uso ou de recursos pagos, e confira os custos de serviços conectados antes de lançar.
Os prompts desta página foram escritos para fazer a maior parte desse trabalho por você — é esse o objetivo deles.
Leia o guia completoPlaybooks relacionados
Prompts relacionados
Revisado em: 2026-07-27