Re: lazy loading for images via css

On Wed, Jul 3, 2013 at 6:29 PM, Tab Atkins Jr. <jackalmage@gmail.com> wrote:

> On Wed, Jul 3, 2013 at 2:19 PM, Felipe Nascimento de Moura
> <felipenmoura@gmail.com> wrote:
> > On Tue, Jul 2, 2013 at 12:44 PM, Tab Atkins Jr. <jackalmage@gmail.com>
> > wrote:
> >> Yes, I wouldn't intend it to be anything more than a hint that the
> >> browser is allowed to load it "later": after all critical resources
> >> but then otherwise unconstrained (except that they must load when they
> >> come into view).
> >
> > Well, this would be quite useful, no doubt!
> > But wouldn't it give more power and options to developers if they could
> > actually say that no image shall be downloaded unless they said so?
> > I imagine it comparing that idea used by Google and Facebook in which
> they
> > load their scripts commented, and only "eval" it when they need, piece by
> > piece.
> > When it JS was created and allowed developers to get their content as
> > string/text(and then eval it or not), I bet they never thought it would
> be
> > used that way, for those reasons.
> > I mean, developers will find a way to make it useful in ways we can't
> > imagine right now, as long as we give them options.
>
> More power isn't always more better.  Authors can already choose when
> to load an image, by just not putting it in the CSS at all, and
> letting JS set 'background' or whatever later.
>
> > Telling the browser to prioritize or not a load is useful, but it would
> also
> > be useful to load the resources in another moment...for example, after a
> > javascript has validated that the user is using a mobile device, or that
> it
> > is under a 3G connection or not.
>
> This is not something the JS dev should be worrying about in the
> slightest; getting it right is very non-trivial (I talk about this
> some in my blog post <http://www.xanthir.com/blog/b4Hv0>).  It's
> handled automatically by the image-set() function, which is in the
> Image Values 4 spec.
>
> This is exactly the problem we face here where I work.
We have about 4 million unique visitors per day...about 1.2 million are
from mobile devices.
We have tried many ways to deal with images, such as loading smaller
images, then identifying if it is a mobile device and load a bigger image
to replace the previous one...
nowadays, we have a server side solution that redirects to "statified"
pages that fit better in one or other kind of devices...
I am pretty sure we could do much more with a few more options, such as
deciding when to load images.
As I said, the defer attribute would already help a lot...I am just not
sure if this is all we can do about it. If there would be any other
interesting, useful thing to do related to it, I think this is the moment
to discuss :)


> ~TJ
>



-- 
*Felipe N. Moura*
Senior Web Developer

Website:  http://felipenmoura.org
 Twitter:    @felipenmoura <http://twitter.com/felipenmoura>
LinkedIn: http://goo.gl/qGmq

Meet some of my projects:
BrazilJS Conference <http://braziljs.com.br/>  |  BrazilJS
Foundation<http://braziljs.org>
|  Power Polygon <http://github.com/braziljs/power-polygon>  |
TheWebMind<http://thewebmind.org/>  |
PHPDevBar<https://addons.mozilla.org/pt-BR/firefox/addon/php-developer-toolbar/>
---------------------------------
LinuxUser #508332
*Changing  the  world*  is the least I expect from  myself!