I briefly touched on this subject in the previous chapter, so let's talk about this a bit more. A great article about showing and hiding elements by Josh Powell can be found at http://www.learningjquery.com/2010/05/now-you-see-me-showhide-performance/.

He compared the speed of showing and hiding elements using different techniques and found that the enabling and disabling of style sheets is the fastest method to show and hide elements on your page. Now, for responsive design, this is very handy, but I feel that hiding elements is being used rather carelessly. When an element is hidden from the viewport of your browser, it still renders when the page is loaded. If you have a lot of elements, they'll all have to render before the page has finished loading. Even worse, if you have images in the section that you are hiding, those requests are still being made to the server.

I propose a better solution. Create a simple rendering function or two rendering functions that...