- Navios
- 19 de agosto de 2026 às 17:29 UTC
- Autor
- Kamo
- Enviar
- 917ad87
A página inicial enviou toda a sua dobra invisível. Framer Motion serializa um `inicial` prop no HTML pré-renderizado como um estilo inline, então a marcação chegou com o <h1>, a coluna de cópia, a abertura do carretel e o sangramento total fundo tudo em `opacidade: 0' — e ficou assim até React tinha baixado, analisado e hidratado e executar seu primeiro quadro de animação. Primeiro e Maior pintura Contentful estavam, portanto, medindo um quarto de megabyte JavaScript pacote em vez da página: o servidor já tinha renderizado o título, e Um guião estava a segurá-lo. Nada vê isso — não a construção, o tipo check, a execução do lint ou a proteção de navegação — e em um link para desktop está invisível. `curl` a página e contar `opacidade:0`: 102 deles, cada elemento acima da dobra entre eles. As mesmas entradas, nas mesmas durações e facilidades, são agora os quadros de chaves CSS. A folha de estilo é analisada antes de um único script ser obtido. O LCP fundo usa uma transição em vez de um quadro de chaves, porque uma transição faz não é executado na renderização inicial — então o frame que está acima na chegada é simplesmente para cima, sem nada para a LCP esperar. O resto da janela de carga, em ordem decrescente do que custa: · O carretel começou a pagar a partir do primeiro byte - `preload="metadata"`, a cartaz sobre o elemento, e uma escada adaptativa abrindo no degrau 540p em 1.17 Mbps — para uma abertura que em um viewport estreito fica abaixo da dobra, sob a coluna de cópia. Ele agora espera pelo evento de carga, em seguida, para o principal linha para ir ocioso, então para a abertura para vir dentro de um viewport. Nível é fechado para o tamanho do jogador e começa no degrau inferior em um telefone. Os leitores Save-Data e 2G/3G mantêm a moldura do cartaz e o botão reiniciar. · O cartaz em si era um JPEG de 93 KB em um cabeçalho de cache de um dia. Através da imagem otimizador é um 26 KB AVIF em uma URL imutável, e não é Foi buscar até o rolo ser procurado. · O logotipo da marca é 132 KB de oito decimais potrace saída, pré-carregado como um imagem, para desenhar uma marca 140 px de largura. Arredondada até uma decimal de uma unidade de 3503 espaço com o enchimento repetido içado, é 59 KB — geometricamente idêntico até 0,0023 CSS px no maior tamanho em que já foi renderizado. scripts/ optim-logo-svg.mjs é idempotente, para a próxima vez que o logotipo for exportado. · GSAP estava na lista de script ansioso de cada página no site, quatro vezes sobre: um tween no brilho da barra de progresso, `gsap.set()` escrevendo dois estáticos propriedades de estilo, um `ofTo` duplicando uma ondulação a folha de estilo foi já animador, e uma chamada de linha do tempo global que só dispara para os leitores que pediram uma redução da moção. Todos os quatro desapareceram da crítica. caminho; o último carrega a biblioteca dentro do seu ramo. · TouchOtimizado mediu cada botão, link e entrada na página durante hidratação, interligando cada leitura com os escritos do elemento anterior — um laço forçado-síncrono-layout várias centenas de elementos de comprimento, pousando em Bloqueamento total Tempo no telefone que existe para ajudar. Actualmente, a lê e espera ocioso. · `<Script strategy="afterInteractive">` emite um `<link rel="preload" as="script">`, que pediu ao navegador para buscar o rastreador de análise em alta prioridade ao lado do fundo do herói. `lazyOnload` ainda grava o visitar, um momento depois e fora do caminho crítico. · O herói montou três camadas de fundo full-viewport. A rotação é somente desktop, então em um telefone dois deles foram permanentemente `opacidade: 0`. · `clearCookieConsent' — duas linhas de armazenamento local — foi exportado do banner de consentimento, então o controle "gerir cookies" do rodapé arrastou 250 linhas de Framer Motion em um bloco que renderiza no HTML inicial. Ele se move para app/lib/cookie-consent.ts, e o banner e a pilha de brindes agora montar em Ocioso: nem pinta nada na chegada. · `experimental.otimizeCss` impresso "? optimizeCss" em cada construção e fez Nada. Ele inlines CSS crítico pelo pós-processamento terminou HTML, que O Roteador de Aplicações nunca o entrega. Verificado contra a saída construída com o Infra- estrutura `bestas` realmente instalada: zero <style> blocos em <head>, o stylesheet ainda é um simples bloqueio <link>. Removido — uma bandeira que informa O sucesso enquanto inerte já é visto como uma otimização tomada. · 36 selectores de classe e 24 keyframes em globals.css sem referência em qualquer lugar do repositório, fornecedor e documentos incluídos. Bytes de caminho crítico, gzip, implantado contra uma compilação limpa: html 38,101 → 36,277 js 281,700 → 245,707 css 18,629 → 17,398 logo 57,390 → 22,902 total 395.820 → 322.284 (-19%) scripts ansiosos 15 → 13 Fora da janela de carga inteiramente em cima disso: o cartaz de 93 KB, o HLS manifesto e seus segmentos de 1,17 Mbps, duas imagens de fundo e o rastreador. Não endereçado aqui: `/` responde 307 a `/en`, que é o URL a página-velocidade execução testes e qual farol conta como redirecionamento. A única solução real é `localePrefix: 'as-necessárias'', e que reescreve canônicos, hreflang, sitesmaps e cada href interno através de ~250 rotas em 22 locais enquanto 301- URL /en/* indexado. Essa é uma decisão de SEO em vez de uma performance, e o hop custa ~60 ms em uma conexão já aberta.