V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
PageSpeed 相关文档
为 NGINX 编译 PageSpeed 支持
ngx_pagespeed
Configuring mod_pagespeed Filters
加载性能测试工具
WebPagetest
Gomez
yeelone
V2EX  ›  前端优化

请问如何 做首页图片延迟加载?

  •  
  •   yeelone · 2014-07-01 17:45:15 +08:00 · 3327 次点击
    这是一个创建于 3798 天前的主题,其中的信息可能已经有所发展或是发生改变。
    我的页面首页放置一系列文章链接,和一个相册,有一些小图片 。

    我想问的是,如果实现 ,让页面其它部分全部加载完了,如背景图之类影响第一观感的,然后再去加载这个相册的图片 。试过lazyload,效果不好,有些相册的图片总是加载不出来。

    求教一些优化的方法
    9 条回复    2014-07-01 21:41:58 +08:00
    vaneoooo
        1
    vaneoooo  
       2014-07-01 17:56:30 +08:00   ❤️ 1
    放狗是能找到一些用于延迟加载的js方案的
    yeelone
        2
    yeelone  
    OP
       2014-07-01 18:43:17 +08:00
    @vaneoooo 搜出来的几乎都是lazyload的。
    jsonline
        3
    jsonline  
       2014-07-01 18:57:43 +08:00 via Android
    img.onload
    new Image

    光靠插件是不行滴,自己写原生的才能精确控制。
    zjgood
        4
    zjgood  
       2014-07-01 19:03:31 +08:00 via Android   ❤️ 1
    @yeelone 那就用js手工处理吧,所有图片的地址都放到data-origin,然后用js监视滚动,再利用js修改回来,几句代码就可以实现
    Livid
        5
    Livid  
    MOD
       2014-07-01 19:05:22 +08:00 via iPhone   ❤️ 2
    用 ngx pagespeed 可以为你自动加上 lazyload。
    yeelone
        6
    yeelone  
    OP
       2014-07-01 19:34:02 +08:00
    @zjgood 是的,我刚已经这么做了,效果比用插件好得多。
    yeelone
        7
    yeelone  
    OP
       2014-07-01 19:35:56 +08:00
    @Livid 不知道apache有没有相似的模块,现在服务器用的是apache
    Livid
        8
    Livid  
    MOD
       2014-07-01 19:39:09 +08:00 via iPhone   ❤️ 1
    @yeelone 有。搜索 mod pagespeed
    xiaoai
        9
    xiaoai  
       2014-07-01 21:41:58 +08:00
    QueryLoader2 之类的preload插件可以帮助你
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   913 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 26ms · UTC 22:06 · PVG 06:06 · LAX 14:06 · JFK 17:06
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.