Many people don’t realize each time they type a character, it occupies a single byte. When you type a single space using the spacebar, it also occupies the same amount of space in memory and/or storage as a single text character. So if I open notepad in windows and create a text file and then press the spacebar 1,024 times it will have a file size of 1k or 1 kilobyte even though the file will look empty and full of “whitespace”. Now it’s a waste of time to even worry about for most people, but it’s been a major issue with many websites. I recently viewed the homepage of KOMO NEWS, KING 5, and KIRO TV, the three major networks in the Seattle area and was surprised to see just how much whitespace two of them contained. The underlying HTML code for KOMO NEWS was 134KB before and after I removed the major portions of whitespace it had dropped to just 90KB. KING 5 was nearly 200KB before and 95KB after. This is only after removing the major portions of whitespace and does not include completely removing every unneeded space character. It’s also worth mentioning that a return character as the result of hitting the “Enter” or “Return” key also occupies space. So spreading a single line of code over three lines takes up an additional 2 bytes. This data gets sent across the internet just like any other data and therefore it consumes bandwidth. In the case of KING 5 which contained at least 100KB of wasted whitespace, with 20k pageviews daily that translates into nearly 2GB of useless bandwidth being wasted. Not only that, it could easily add 200-500ms of loading time, especially things such as mobile devices and those with less than 1.5Mbps connections. It also doesn’t include all the whitespace in CSS and Javascript files.

Categories: optimization, whitespace, html,