How Facebook made mobile site faster for users with limited bandwidth

By resorting to unconventional engineering, Facebook saves users in developing countries precious bandwidth while still offering them a close-to-optimal Facebook experience.

In tackling the problem, the Facebook engineering team didn’t turn to new technology, but rather thought hard about the tools it was already deploying.

“We used existing technology, but in a kind of clever and unique way,” said Brian Cabral, Facebook director of engineering.

The work they did cut the time it takes to download a Facebook page in limited bandwidth conditions by 30 percent. The page could be viewed more quickly, both on the Web and through the company’s mobile app.

They also learned some lessons in how much an image can be compressed and still be useful.

With over 1.49 billion users, Facebook is now courting people in parts of the world where neither computers nor high-speed Internet connections abound. That’s why it has been looking for ways to conserve bandwidth, so people on slower 2G networks can still use the service.

“Especially in places like India and developing markets, 2G is still the dominant network,” said Marty Greenia, a Facebook software engineer.

One of the first projects was trimming the size of each user’s cover photo, the image that stretches over the top of profile pages.

This cover photo can run 100KB or larger, which can take some time to download on a 2G connection that tops out at 32KB per second.

As a result, users with limited bandwidth would not see the image for those profile pages they visited, at least not initially. This isn’t a desirable Facebook experience.

For low-bandwidth users, the Facebook engineering team wanted to reduce the size of each photo to, ideally, 200 bytes. An image made from 200 bytes, which is a mere 1,600 individual bits, would download quickly even on a slower connection.

Putting images on a 200 byte diet would be quite a challenge, given that the JPEG image format everyone uses for their photos already compresses images, quite efficiently.

The engineering team attacked the problem in a number of ways. “We thought long and hard about this,” Cabral said.

One approach the team used was to make a copy of the photo as a frosted-glass impression, in which the details are blurred out, reducing the image size. The frosted glass impression could serve as a stand-in until a full size copy of the image could be downloaded.

Even with the image blurring, the size needed to be cut further, Cabral and Greenia explained in a jointly authored blog item posted Thursday describing the work.

They found that each JPEG file comes with a lot of metadata, describing the attributes such as the photo size. But given that this header data was the largely the same in all cover photos, it could be easily removed and recreated with fixed headers stored on the user’s device. “We knew what those bytes would look like,” Cabral said.

Finally, a couple of crafty, non-standard compression schemes also helped cut the images to the required size.

The techniques they deployed worked well not only for users with limited bandwidth, but also for all wireless users.

During time of network congestion, a frosted image will often pop up for a few seconds before the full image can be displayed, leading to a more seamless Facebook experience, Greenia said.

Another advantage the work offered was that it could save a bit of money for those on metered data plans, which is often the case for people on 2G networks in developing markets.

“Often people are making trade-offs between using their data plan and using their money for other things,” Greenia said. “I feel proud when I can save someone money.”