Uma animação no ponto de contato, seis deles, um para cada forma que uma imprensa pode acontecer

Featurekamo-internal
Navios
7 de setembro de 2026 às 06:37 UTC
Autor
Kamo
Enviar
807a35c

Esquerda para baixo, esquerda para cima, meio para baixo, meio para cima, tocar para baixo e tocar para cima cada obter sua própria animação em torno do ponto de contacto. São uma família em vez de seis ideias: uma imprensa puxa energia IN e um lançamento permite que ele OUT, de modo que um clique comum lê como um único gesto — o anel que colapsa em sozinho, porque uma imprensa sem um comunicado (a drag) e um comunicado cuja imprensa nunca foi visto ambos Acontece. Botão direito do mouse fica em silêncio: abre um menu que está prestes a cobrir a animação de qualquer maneira. esquerda para baixo Converge um anel de linha de cabelo se encaixa para dentro em um ponto core esquerda para cima Bloom o núcleo lança: dois anéis e seis faíscas, semeado por clique médio para baixo Abertura fechar quatro segmentos de arco girar e fechar, mecânico em vez de orgânico meio acima Abertura estourar os segmentos contra-espino para fora, estreitando em traços toque para baixo Pool um halo suave sem borda, porque um dedo cobre o ponto em si retoque Ripple dois anéis concêntricos desacelerando para fora, mais largo do que o mouse A cor é misturada a partir de --color-primary, então uma organização de rótulo branco recolore todo o sistema sem uma linha de código, e #696969 fica em quando um inquilino nunca definiu um. Isso é executado em uma ferramenta que as pessoas mantêm aberto o dia todo, então o custo ocioso foi a restrição de design. O ciclo rAF é iniciado pelo primeiro impulso e retorna no momento em que o último morre. A loja de apoio — dezenas de megabytes de memória GPU em DPR 2, 33 MB em uma tela 4K — é alocado com o loop e liberado Com ele, então uma concha ociosa paga por dois ouvintes e nada mais. Cada quadro limpa apenas a união de limites vivos em vez do framebuffer, por isso todo tipo declara o alcance que pinta dentro e por que esse alcance é afirmado em dez pontos ao longo de sua vida: um anel deixar um arco na tela que o próximo claro é muito pequeno para apagar, e nada mais iria notar. Os ouvintes são eventos de ponteiro em vez de mouse plus touch, que é um ponto de correção e não um preferência: um dispositivo de toque também sintetiza mousedown/mouseup após um toque, então a versão de duas famílias pinta cada torneira duas vezes. Eles estão na fase de captura porque o shell chama de stopPropagation em um grandes muitos lugares e um ouvinte borbulhante na janela nunca ouviria esses cliques. Sob prefere-reduzido-moção todos os seis colapso a um halo que desaparece sem se mover em tudo. O motor é puro e não detém nenhum DOM, então toda a camada de desenho é testada em nó contra um contexto de registo — 28 ensaios, incluindo que nenhum tipo pinta fora do seu alcance, que cada um dos seis é uma animação genuinamente diferente em vez de reutilizada, e que as faíscas variam com suas sementes. Dois defeitos foram encontrados por traduzi - lo em vez de raciocinar sobre ele. As faíscas foram misturadas para o branco, que nesta concha de modo de luz forçada é a direção do fundo, e o flor é um florescer era tudo, mas invisível; eles estão misturados para preto agora. E a atribuição foi inferido de `canvas. largura === 0`, o que nunca é verdade para uma tela que não foi dimensionada — ele relata a intrínseca 300x150 — então o primeiro impulso de cada página de carga pulou alocação e manchado em uma loja 300x150 esticado através do viewport. Agora é uma bandeira explícita.

Todas as alterações

Como o que vês no transporte?

Cada uma dessas atualizações pousa automaticamente em seu espaço de trabalho. Comece grátis e veja crescer semana após semana.

Começar Livre Para SempreVer Preços