Estoy teniendo un pequeño problema de rendimiento. Increíblemente en mi PC, el sitio web que estoy enlazando a continuación me está dando muchos problemas de rendimiento. Y no tanto de FPS ya que he visto que Chrome, Firefox, IE tienen buenos FPS pero al parecer es algo más que está haciendo que la animación se vea cortada / cuadro por cuadro.
Me interesaría conocer alguna manera de realizar lo siguiente:
- Identificar el rendimiento real de la animación.
- En el caso de que el rendimiento no dé por lo menos 30 FPS como mínimo, eliminar el canvas con la animación liberando la memoria y colocando el fallback (ya está hecho) el cual es únicamente un fondo de nubes en la parte inferior de la pantalla.
Esta es la página: http://sonetoresidencial.com/landingpages/
Me interesaría saber por qué en Windows específicamente la animación se ve horrible, pero en Mac y hasta en iPhone, se ve increíble.
Estoy utilizando Three.js para esta animación.
Solo me interesa mostrar esta animación si el navegador en cuestión soporta webgl (ya lo identifica mi JS con Detector.js) pero también me interesa que lo vean bien y que no alente la PC por intentar mostrar esta animación, por lo que me gustaría ver la manera de identificar el rendimiento de la animación y quitarla o simplemente no cargarla si el rendimiento no permitirá por lo menos 30 fps.
Me podrían apoyar con esto?
Gracias!