We're looking for a user researcher to understand the needs of developers and designers. Is this you or someone you know? Check out the post: https://mzl.la/2IGzdXS

<canvas> es uno de los estándares más utilizados para la representación de gráficos 2D en la Web. Se utiliza ampliamente en los juegos y visualizaciones complejas. Sin embargo, as Web sites and apps push canvas to the limits, el rendimiento comienza a sufrir. This article aims to provide suggestions for optimizing your use of the canvas element, to ensure that your Web site or app performs well.

A continuación una lista de tips par mejorar el rendimiento:

  • Repintar primitives similares o objetos repetidos dentro y fuera de la pantalla canvas.
  • Batch canvas calls together (for example, draw a poly-line instead of multiple separate lines).
  • Avoid floating-point coordinates and use integers instead.
  • Avoid unnecessary canvas state changes.
  • Render screen differences only, not the whole new state.
  • Utilice varios lienzos en capas para escenas complejas.
  • Evite la propiedad shadowBlur siempre que sea posible.
  • Con las animaciones, use window.requestAnimationFrame().
  • Probar el rendimiento con JSPerf.

Etiquetas y colaboradores del documento

Colaboradores en esta página: Cax
Última actualización por: Cax,