css - HTML5 Canvas as a background -


i designing site uses canvas draw , animate moving stars background. looks have concerns performance.

at moment falls flat background if it's version of ie (as though ie9 + 10 support canvas - slows them down bit), , same mobile / other browser doesn't support canvas.

it runs fine on latest chrome/firefox/safari + opera in particular setup have no idea whether or not land decent browser poor performance computer having trouble using site.

considering following factors important:

  • browser, browsers have poor canvas perf
  • device, slower devices perform poorly, possibly affecting whole site negatively

as stated in comments, it's important consider background movement won't distracting.

with mobile devices , tablets should able reasonably detect whether device 1 want run this.

on rest, simple dynamic test: when site has loaded animating background, run performance test: attempt update canvas fast possible. if high enough framerate using this, can safely assume user's device capable of rendering canvas adequately. devices fps lower expected, disable background. include cookie future visits disables/enables background automatically.


Comments