Pesquisar

Aparecido C.

(4.88 - 10 avaliações)

Projetos concluídos: 7 | Recomendações: 10 | Registrado desde: 27/12/2024

Sobre mim:

Procuro profissional para trabalhar em.meus projetos.

Histórico de projetos & Avaliações:

Carregando...

Projetos (Aguardando Propostas):

  • Correção de performance (SSG e ISR)

    Desenvolvimento Web | Orçamento: Aberto | Publicado: | Propostas: 14

    Tenho um e-commerce em Next.js (App Router) já funcional, porém com problemas de hidratação e re-renderização no carregamento.

    Mesmo após aplicar SSG e ISR, alguns componentes above the fold (FullBanner, Header, Barra de Pesquisa e Ícones) ainda piscam/atualizam após o F5, indicando renderização incorreta no client.

    Busco um dev experiente em Next.js App Router, com domínio real de Server Components, SSG, ISR e hidratação.

    Objetivo

    Deixar as páginas públicas 100% estáticas no HTML inicial, com carregamento instantâneo, sem flicker, sem segunda renderização e com layout estável.

    Stack

    Next.js (App Router)

    React

    Tailwind CSS

    Backend já otimizado

    MongoDB com índices

    Cache já configurado

    Problema atual

    FullBanner renderiza após o primeiro paint

    Header / Barra de pesquisa / Ícones aparecem com delay

    Página dá a sensação de "duas atualizações" ao dar F5

    Conteúdo principal (produtos, preços) já vem correto no HTML

    Escopo do trabalho

    1) FullBanner

    - Garantir renderização correta via Server Component

    Se for Client Component:
    - HTML inicial idêntico ao server
    - Altura fixa
    - Sem useEffect/useState para render visual
    - Sem dependência de Provider

    2) Header / Barra de Pesquisa / Ícones

    - Estrutura visual renderizada no servidor
    - Interatividade pode hidratar depois
    - Nenhuma mudança de layout após o carregamento do JS

    3) Providers

    - Providers não podem fazer fetch para páginas públicas
    - Apenas receber dados iniciais

    4) Regra obrigatória

    - Nenhum elemento above the fold pode mudar após o F5.

    Critérios de aceite (Obrigatórios)

    - F5 — página renderiza uma única vez
    - Sem flicker visual
    - Com JavaScript desativado:

    - Banner, Header e Search continuam visíveis
    - Nenhum fetch de banner/produtos no client

    - CLS ? 0.01
    - Lighthouse Mobile ? 85

    Pagamento condicionado a esses critérios.

    Prazo estimado

    6 a 12 horas de trabalho real

    Importante

    Este projeto não envolve backend, não envolve SEO e não envolve redesign. É exclusivamente correção de arquitetura de renderização e hidratação no Next.js App Router.

    Diferencial

    Se você:

    - Entende a diferença real entre CSR, SSR, SSG e ISR
    - Sabe separar Server vs Client Components
    - Já resolveu problemas de hidratação / flicker

    Este projeto é ideal para você.

    Aguardo propostas com breve explicação de como você resolveria o problema.

    Habilidades desejadas: React Native e Front-End.

Carregando...

Carregando...

Pesquisar

FREELANCERS
PROJETOS
Ocorreu um erro inesperado. Caso o erro persista, entre em contato conosco através do e-mail suporte@99freelas.com.br.