W3C home > Mailing lists > Public > public-web-perf@w3.org > May 2013

Re: <img src="..." defer>

From: Steve Souders <souders@google.com>
Date: Wed, 22 May 2013 12:35:42 -0700
Message-ID: <CA+hp-_vj9wHMY98cvLBKJ2LJedPiC5nZOgvzzr3FwheNRYFNbw@mail.gmail.com>
To: Jake Archibald <jakearchibald@chromium.org>
Cc: Jatinder Mann <jmann@microsoft.com>, "public-web-perf@w3.org" <public-web-perf@w3.org>
SHORT: We need the foil of "defer" so that image download priority is
INcreased.

LONG:
I love the idea of being able to defer images, but that leaves images with
only these two states:
    - *deferred*
    - *not deferred*

So I have two choices: my images get loaded very late, or they get loaded
late (because scripts, stylesheets, and fonts have a higher download
priority in some major browsers).

*What if I have an IMG that I want to load at a higher priority?! *

Here's a great example. Airbnb has a huge IMG that fills the background of
the entire page. It's the very first IMG in the document. It's obviously
critical to the UX. But, because of Chrome priorities, it gets loaded too
late. In these WPT
results<http://www.webpagetest.org/video/compare.php?tests=130515_TD_QYX-r%3A1-c%3A0&thumbSize=200&ival=100&end=visual>
this
huge image (the first IMG in the document!) gets pushed out to request #12
and doesn't show up until 3.4 seconds into the page load.

Instead, it would be better if this IMG was downloaded with equal priority
to scripts & stylesheets, or at least higher priority than any other image
(including CSS images). But, even if "defer" gets adopted, we'll still have
no way to promote this IMG to get it to appear earlier.

We need the foil to "defer" so that image download priority is INcreased.

-Steve



On Wed, May 22, 2013 at 8:25 AM, Jake Archibald
<jakearchibald@chromium.org>wrote:

> On Tue, May 21, 2013 at 9:09 PM, Jatinder Mann <jmann@microsoft.com>wrote:
>
>>  Based on discussions with web developers, the attribute name ‘delay’
>> doesn’t seem clear and can carry the wrong connotations that the attribute
>> is slowing down the page load
>>
> …I recommend we instead use the attribute name ‘delayload’. This name is
>> very clear that the attribute will delay loading the lower priority
>> resource.
>>
>
> I imagine developers will react the same to 'delayload' as they do to
> 'delay', although I'm just guessing.
>
> 'delayload' as in 'delay the load' sounds like the image may delay the
> loading of the page, when (in terms of the load event of the document) it
> does the opposite.
>
> 'lazy' or 'lazyload' sounds more like it's only impacting the image,
> perhaps because it's an existing term and used frequently in relation to
> image loading.
>
>
>>  Also, as XHRs can just be deprioritized through script and they are the
>> only non-element on the list, I recommend we just remove them.
>>
>
> +1
>
Received on Wednesday, 22 May 2013 19:36:14 UTC

This archive was generated by hypermail 2.3.1 : Tuesday, 6 January 2015 21:04:35 UTC