If you’re not familiar with them, they’re the sites where the visual structure of the page changes as you scroll. Normally elements within the page scale, rotate or move proportionally to the scroll position on the page.
Whether or not you like parallaxing sites is one thing, but what you can say pretty confidently is that they’re a black hole of performance. The reason for this is that browsers tend to be optimized for the case where new content appears at the top or bottom of the screen when you scroll (depending on your scroll direction) and, in general terms, the browsers work best when very little changes visually during a scroll. For a parallax site that’s rarely the case since many times large visual elements all over the page change, causing the browser to do a repaint of the whole page.
It is reasonable to generalize a parallaxing site like this:
- Background elements which, as you scroll up and down, change their position, rotation and scale.
- Page content, such as text or smaller images, which scrolls in the typical top-to-bottom fashion.
Type: WebGL Framework
Source: <a href="http://www.html5rocks.com/en/tutorials/speed/parallax/" target="_blank">http://www.html5rocks.com/en/tutorials/speed/parallax/</a>
Demo: <a href="http://www.html5rocks.com/static/demos/parallax/demo-2/demo.html" target="_blank">http://www.html5rocks.com/static/demos/parallax/demo-2/demo.html