Fun With <canvas>







Michael Bromley
@michlbrmly
www.michaelbromley.co.uk

What Is Canvas?


  • an HTML element
  • introduced by Apple in 2004
  • has become a standard for immediate-mode 2D graphics on the web.


immediate mode = draw everything, every frame.

Some Demos


  • a taste of the canvas API
  • how to draw basic shapes and colours
  • how to do basic animation
  • how to make it interactive

Some Optimizations

  • use requestAnimationFrame rather than setTimeout
    http://dev.opera.com/articles/better-performance-with-requestanimationframe/
  • group paint commands together
  • DRAW LESS!

Thank you



Code available on GitHub:
https://github.com/michaelbromley/canvas_experiments

Have fun!




@michlbrmly
www.michaelbromley.co.uk
Made with Slides.com