- Shipped
- 6 de setembro de 2026 às 14:20 UTC
- Author
- Kamo
- Commit
- ab890f8
Reportado: "depois de cerca de um minuto ou dois, a página parece animar, em seguida, animar E está completamente trancada. O navegador quer fechar a aba." Reproduzido em o código em vez do navegador; três perigos de página inteira separados, um dos quais É a causa e dois deles aguardavam a sua vez. 1. useShelves estava forçando layout em subárvores de visibilidade de conteúdo — A CAUSA Ele chamou getBoundingClientRect() em cada elemento correspondente no documento, em cada moldura de pergaminho. Vinte e três elementos atrás de um acelerador rAF lê como nada, por isso sobreviveu revisão, e em quase qualquer outro site Não seria nada. globals.css coloca `content-visibility: auto` em cada `seção principal:not(#home)` — deliberadamente, porque oito secções abaixo do dobro estão dispostas enquanto A imagem LCP esperada foi medida em 1,810 ms de atraso de renderização. getBounding ClientRect é uma leitura com força de disposição, por isso, perguntando- lhe sobre um elemento dentro de uma sub- árvore ignorada faz com que o navegador lay que subtree para fora imediatamente para responder, e depois pulá-lo Mais uma vez, ainda está fora do ecrã. Sessenta vezes por segundo, para todos oito secções, não se limita a desfazer a optimização — converte-a em um custo recorrente que nunca existiu antes. A metade visível segue de `contain-intrinsic-size: auto 900px`: aqueles seções alternam entre sua altura lembrada e o placeholder, de modo que o a altura do documento oscila, e cada `animação- timeline: view()` slock revelar na página re-runs fora dos offsets alterados. Essa é a página animadora Vai e volta. O custo do layout composto é o bloqueio. Agora ele nunca faz uma pergunta de um elemento que já não é renderizado. An IntersecçãoObserver — o que não força nada — mantém próximo o conjunto de candidatos o viewport, e somente esse conjunto é sempre medido. Elementos numa sub- árvore ignorada Nunca estão nele. A lista de candidatos é reconstruída a cada 3s em vez de cada quadro. 2. will-change: transformada saiu das camadas de sobreposição Não comprou nada que já não fosse pago: uma tela repintando cada frame obtém sua própria camada de composição independentemente. O que ele comprou foi um textura full-viewport para a camada WASH — um gradiente CSS estático que nunca animates — realizada para a vida da cena, vários megabytes em 1440p, em um página já carregando noventa e poucos painéis de filtro de fundo. 3. mix-blend-mode saiu de todas as cinco cenas que o usaram Um modo de mistura numa camada fixa de full viewport faz com que o compositor leia tudo página de volta cada quadro para misturar contra ele. Ligando-o a 'qualidade' === "completo" foi o instinto certo na profundidade errada; na página onde um efeito de página inteira tinha pendurado apenas uma aba, enviando outro que eu não posso medir daqui não é um O comércio vale a pena fazer um palpite. Nada se perde — ‘tela’ com branco sobre uma tela escura está perto do que o alfa simples desenha — e as cenas que precisam luz aditivo já fazê-lo dentro da tela com `lighter', contra o Outras partículas e não contra o documento. E um cão de observação, porque o próximo não será encontrado por revisão também useSceneCanvas agora mede o intervalo real do quadro — não o `dt` entregue cenas, que é preso e por isso nunca pode relatar problemas — e se a página não pode segurar 15fps em dez segundos contínuos a cena pára para sempre, limpa ele próprio fora da tela e diz porquê no console. Dez segundos é tempo suficiente. que um GC ou outra aba roubando o CPU não pode tropeçá-lo, suficientemente curto que um leitor recebe sua página de volta antes de alcançar o botão fechar. A bandeira travas, então retornar para a aba não reinicia uma cena nas condições que o esfomeou, e uma cena parada pára de reconstruir as suas imagens em redimensionamento. Dezoito cenas de tela correndo contra a geometria DOM ao vivo em hardware ninguém Aqui viu que vai falhar novamente de alguma forma nenhum de nós previu. Isto decide o que isso custa: uma página não-corada, não inutilizável. Também fixo: `dt` foi documentado "nunca 0" enquanto apenas o teto foi preso. Dois Os callbacks rAF podem compartilhar um timestamp, e uma cena dividindo por dt para recuperar uma taxa põe um Infinito numa posição. Piso em 1/480. Nenhum visitante comum foi afetado — hoje resolve não ter férias, de modo que isso foi apenas Atingível através do catador de rodapé. tsc limpo, 14 guardas verdes, 187 rotas ainda Render-se.