flag-cloth

Rendimiento

Mantén el coste de simulación, relleno e iluminación en proporción con lo que el usuario puede ver.

La cuadrícula predeterminada de 32 × 20, dos subpasos y seis iteraciones crea 693 partículas y 3,890 restricciones precalculadas. Para un perfil más agresivo, prueba primero un solo subpaso antes de reducir la cuadrícula. Aumenta una dimensión a la vez mientras analizas el rendimiento.

Controles con mayor impacto

  1. Pixel ratio: rellenar un canvas grande suele costar más que el solver.
  2. Cantidad de segmentos: aumentan las partículas, triángulos, restricciones, cálculos de viento y normales.
  3. Iteraciones y subpasos: multiplican directamente el trabajo del solver.
  4. Sombras y frecuencia de normales: utiliza el perfil performance para cuadrículas grandes o varias banderas.

Trabajo de ciclo de vida ya resuelto

  • Paso de tiempo fijo y delta máximo
  • Pausa por visibilidad de página y, opcionalmente, por viewport
  • Cambio de tamaño solo cuando cambian las dimensiones
  • Arrays tipados y extremos de restricciones precalculados
  • Sin vectores temporales en los bucles de partículas, triángulos o restricciones
  • Cancelación de animación y liberación de listeners, observadores, texturas, programas y buffers al destruir

El panel de depuración es opcional. Mide FPS, tiempo de simulación, tiempo de renderizado, partículas, restricciones y draw calls. No uses sus FPS como objetivo de frecuencia, porque los navegadores normalmente sincronizan la animación con la pantalla.

En esta página