Their screenshots are kind of vague, and it's unclear whether the S3 browser actually implements srcset incorrectly or if this is just a complaint about our JavaScript fallback implementation, which allows the 1x images to load first and then goes and loads the 1.5x or 2.0x images.
This does use more data than loading *only* the 1.0x images (obviously), as does it use more data than loading *only* the 1.5x or 2.0x images. However it should have nearly zero impact on time-to-interactivity, since the read.
Can we get some more detail from them? Like, did they test any sites other than Wikipedia, or other browsers than the S3's for this bug? The research paper PDF says "it turns out" that the S3 browser has the bug but doesn't explain how they determined this. Do they see three loads per image (which would be what they describe as the error) or two loads per image (which is what I expect to see under the current code)? Their diagram circles three images, but only two of them are of the same image and appear to be a 1.0x and 2.0x pair.
[Note that we can also improve this dramatically on mobile if we can prevent preloading of images in initially-collapsed sections; we might then be able to replace the URLs before the 1.0x images load for anything outside the lead section.]
-- brion
On Mon, Jun 3, 2013 at 1:04 PM, Tilman Bayer tbayer@wikimedia.org wrote:
BTW, it seems that a certain mobile phone manufacturer wasn't quite ready for this ;)
http://tech2.in.com/news/smartphones/samsung-galaxy-s3-browser-bug-inflates-...
" According to the researchers, the problem is caused by the srcset HTML attribute, which indicates the size and resolution of images a browser should pick based on the device’s screen size and magnification needed. ...
The Galaxy S3’s browser, however, has a bug that makes it download all the images specified in the srcset HTML attribute instead of the ones it needs, resulting in long load times and lots of data usage. For instance, the researchers loaded a Wikipedia page that was only 600 KB when browsed using Internet Explorer, but the page’s size inflated to a whopping 2.1 MB on the Galaxy S3.
“This bug significantly affects the Wikipedia performance on 3G were these massive number of requests for image downloads overwhelmed the network and ended up timing out rendering an incomplete page,” the research paper reads. "
On Thu, Sep 27, 2012 at 3:45 PM, Brion Vibber brion@pobox.com wrote:
On Sun, Sep 23, 2012 at 7:59 PM, Brion Vibber brion@pobox.com wrote:
I've updated the patch to use the 'srcset' attribute as defined in the current HTML 5 working group version, only using the density options and not the width/height options:
http://www.whatwg.org/specs/web-apps/current-work/multipage/embedded-content...
Patch in gerrit: https://gerrit.wikimedia.org/r/#/c/24115/ (core) https://gerrit.wikimedia.org/r/#/c/24147/ (MobileFrontend)
Patch has been updated to:
- include QUnit tests for the srcset matching
- match "next-highest density" if there's not an exact match available
This latter fixes Opera Mobile on my Galaxy Nexus (where devicePixelRatio reports 2.25 rather than the expected 2) and BlackBerry 10 developer
alpha
device (where it reports slightly less than 2.25). Should help with some other funky configurations where a non-integral zoom is reported as well.
Currently Firefox for Android doesn't report window.devicePixelRatio, I
may
add another special case, should be able to use media queries.
Opera Mobile works, but Opera Mini does not -- at least because we don't serve it jQuery etc. :)
You can see a live demo of this patch in action on these test articles:
Mobile browsers won't automatically switch to mobile view on this wiki currently, so hit the 'mobile view' link manually to switch in.
-- brion _______________________________________________ Wikitech-l mailing list Wikitech-l@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/wikitech-l
-- Tilman Bayer Senior Operations Analyst (Movement Communications) Wikimedia Foundation IRC (Freenode): HaeB
Wikitech-l mailing list Wikitech-l@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/wikitech-l