perf(movimento): vitrine e 3D mais leves, WebGL por software lembrado na sessão e suporte ao WebKit

app/components/showcase/showcase-math.ts

@@ -38,6 +38,20 @@ export function reelStarts(weights: number[]): number[] {
 /** Fração do trecho de cada projeto em que o vídeo fica parado, no começo e no fim. */
 export const REEL_HOLD = 0.1;
 
+/**
+ * Pausa no fim do último projeto: depois dele não há troca a esperar, e o palco já se solta da página. Fica só o
+ * bastante para o último quadro chegar antes de o palco subir (era a mesma pausa de 10%, com a rolagem ainda presa).
+ */
+export const REEL_LAST_TAIL = 0.03;
+
+/** As pausas do projeto `index` de `count`: no começo e no fim do trecho dele. */
+export function reelHolds(index: number, count: number) {
+  return {
+    head: REEL_HOLD,
+    tail: index === count - 1 ? REEL_LAST_TAIL : REEL_HOLD,
+  };
+}
+
 /** Avanço total (0 a 1) em que o projeto `index` está em `local` (0 a 1) do trecho dele. */
 export function reelOffset(weights: number[], index: number, local: number) {
   const total = weights.reduce((sum, weight) => sum + weight, 0);
@@ -49,11 +63,24 @@ export function reelOffset(weights: number[], index: number, local: number) {
  * O trecho de cada projeto tem uma pausa no começo e outra no fim: o vídeo só anda no meio.
  * Isso dá tempo de ler o título antes de o site começar a rolar e de descansar antes da troca.
  */
-export function videoProgress(local: number, hold = REEL_HOLD): number {
-  const span = 1 - hold * 2;
+export function videoProgress(
+  local: number,
+  hold = REEL_HOLD,
+  tail = hold,
+): number {
+  const span = 1 - hold - tail;
   return Math.min(1, Math.max(0, (local - hold) / span));
 }
 
+/** O contrário de `videoProgress`: onde, no trecho do projeto (0 a 1), o avanço `progress` do vídeo acontece. */
+export function localAtProgress(
+  progress: number,
+  hold = REEL_HOLD,
+  tail = hold,
+) {
+  return hold + progress * (1 - hold - tail);
+}
+
 /** Aproxima `current` de `target` de forma suave, independente da taxa de quadros (`tau` em segundos). */
 export function easeToward(
   current: number,