CODEWITHSUNDEEP
html5-canvas
Geoffrey-ap
Geoffrey-ap

Reputation: 380

Canvas background performance

This is quite simple, I want to increase the performance of my page by using canvas to generate diagonal lines pattern instead background-image. Should I do that? why?

Upvotes: 0

Views: 64

Answers (1)

Nevin
Nevin

Reputation: 3298

If you're displaying static content, is slower and much more obtuse. and do completely different things, the former being for dynamic graphics using JavaScript and the latter being for static images retrieved from a URI.

Browsers tend to be optimised for loading IMG sources while the HTML is streaming: so you'll see an image before the page has loaded completely. Canvas, on the other hand, will be dependent on the DOM being loaded, so (typically) won't load until the DOMContentLoaded event has fired. Add to that the latency in creating a Canvas context and the memory requirements and it almost certainly isn't what you want if the images are truly static.

If you want to do something fancy with the image why not load the image in an IMG tag and then convert it to a canvas once loaded to do the transformations?

Upvotes: 1

Related Questions