Beantin webbkommunikation

Beantin Beta Blog

Experiments, investigations, and tests of web things
November 5, 2012

Page visibility: pause when your web page isn’t visible

The Page Visibility API is a way for you to (programatically) ask the browser whether your webpage is currently visible or not. Running scripts, videos, refreshes, etc when your webpage is minimised or open in a tab that’s not being viewed is a waste of CPU.

Using up CPU time when not needed contributes to making your visitor’s machine/device sluggish and wastes precious battery.

The Page visibility API is still “experimental” but it is supported by the latest versions of Chrome (13 and higher), Firefox (10 and higher) and Internet Explorer (10 and higher). Unfortunately support in mobile devices and Safari seems to be limited. Mozilla gives a good overview of browser support and Google gives some more info and examples too.

If you want to know if your browser supports the Page Visibility API, then Microsoft has provided a really nice straight forward test page.

As the API is still experimental, there is some vendor-prefix soup that you will have to swim through. Here is a useful visibility API wrapper to help simplify that task.

A good use of the page visibility API would be to make sure your sliding banner or carousel stops rotating when no-one is looking. (Best of all would be to take the giant sliding banner away completely!)

Related Posts Plugin for WordPress, Blogger...

Tags

Filed under Research.

Tags: , ,

  • fristedt

    It didn’t work on my IE8/Win XP workstation, so I gather it’s a IE9 thing.

    •  IE10 is the first version of IE that supports the page visibility API. I’ve updated the post to be clearer about the browser versions…

Theme Beantin created by James Royal-Lawson. Privacy Policy