Chrome’s HTML5 Hardware Acceleration Gotcha
Most developers by now (especially those targeting mobile browsers) agree that taking advantage of browser hardware acceleration is pretty critical. Ticks like forcing elements to be accelerated by using identity 3d transforms can greatly improve the user experience.
But sometimes it’s not just about speed. We ran into a confounding bug report where a few users were seeing big rendering errors that we couldn’t reproduce despite using the same browsers and operating system. It turned out a few users’ browsers (specifically Chrome 26) were not providing any hardware acceleration.
with it turned off, it was:
Since you normally expect Chrome to support this, it’s unlikely you’d think that any no-csstransform3d code would ever apply to that browser.
It’s a good idea to add this case to your browser compatibility testing regimen. In Chrome go to:
about://settings > Show Advanced Settings > Use hardware acceleration when available
Firefox (21.0) and IE 10 also have a similar setting, but I haven’t seen any functional or Modernizr detected differences with that setting.