A Web App Dilemma: Bandwidth vs. High-Resolution Images
Mobile manufacturers are increasingly developing smartphones and tablets with high-resolution displays, which is great for viewing most native apps. However, these displays can make web apps look extremely fuzzy when mobile device bandwidth is limited and high-resolution images can’t be displayed. So what can a web app developer do?
Scott Gilbertson of Webmonkey says there is not much a developer can do, at least for now:
“The answer, for now, is that there is no good answer; be it bandwidth or image quality you’re going to have to compromise somewhere.
That’s why mobile expert Peter-Paul Koch thinks browsers need to start broadcasting the connection speed of the device. “Browsers, especially mobile ones, should give information about the speed of the connection they’re on,” writes Koch in a recent blog post exploring just what that might look like and how web developers might use that information.
Here’s what Koch thinks developers need:
-We need an HTTP header, so that a server-side script can use the information to decide whether to send the lowsource or high-res images. Let’s call it X-Connection-Speed for now.
-A JavaScript property, say navigator.connectionSpeed, also makes sense.
-Chris Coyier proposed a bandwidth media query with matching min-bandwidth and max-bandwidth. Sure, why not?
Check out Koch’s post for full details on other aspects like units, how connections speed might be calculated and what to do with edge cases — like when the connection speed changes between read and page load (Koch’s scenario imagines a user on a phone in a train with a good connection that deteriorates when the train enters a tunnel).”
What do you think of Koch’s thoughts- should web app developers be able to decide how much bandwidth a web app uses? Share your thoughts in the comments section.






