typcn
V2EX  ›  问与答

如何让 AJAX 请求 加载的慢一点

  •  
  •   typcn · Nov 20, 2014 · 5159 views
    This topic created in 4368 days ago, the information mentioned may be changed or developed.
    我写了个 blog 系统,google 了一个加载动画,结果发现,动画还没开始播放,页面已经加载完了,如何让请求慢一点,或者是在动画完全覆盖网页之后再开始加载。不然感觉有点不协调了。。


    

    地址 http://blog.eqoe.cn/

    手打的 js 和 css 都是没有压缩的,除了 jquery
    Supplement 1  ·  Nov 20, 2014
    好吧解决了 又离 Callback hell 近了一步

    给 loader.show() 加了一个callback参数

    在 OnAnimateEnd 的 Callback 中 执行show事件的callback
    35 replies  •  2014-11-20 23:05:55 +08:00
    lichao
    lichao
    Nov 20, 2014❤️1
    1
    让 Ajax 的后端,sleep 一两秒
    typcn
    typcn
    OP
    Nov 20, 2014
    2
    @lichao CDN会缓存请求的啊
    adjusted
    adjusted
    Nov 20, 2014
    3
    animationend的listener?
    typcn
    typcn
    OP
    Nov 20, 2014
    4
    @adjusted 如何 listen 一个 div 是否有某个 class,难道只能用定时器吗
    lichao
    lichao
    Nov 20, 2014
    5
    @typcn 你的 Ajax 如果是基于 post 请求,应该不会有缓存
    如果是 get 请求,url 后面加个时间戳
    hellojinjie
    hellojinjie
    Nov 20, 2014
    6
    好炫的效果啊
    hcymk2
    hcymk2
    Nov 20, 2014
    7
    好像翻页的时候能看到动画效果。
    typcn
    typcn
    OP
    Nov 20, 2014
    8
    @lichao 我就是想在他缓存的情况下等,不加缓存的话 ,我怕服务器带宽受不住,一天承受几万次CC的
    @hellojinjie 哈哈 业余爱好写写 blog
    typcn
    typcn
    OP
    Nov 20, 2014
    9
    @hcymk2 点击文章页可以的
    lichao
    lichao
    Nov 20, 2014
    10
    @typcn 那可以在客户端 setTimeout 啊,方法多多的
    typcn
    typcn
    OP
    Nov 20, 2014
    11
    @lichao 在电脑上 动画加载的很快,如果set上1秒的话 会觉得加载有点慢了,在手机上 set 1秒正好,但是0.5秒就有点问题了,比较纠结 这个
    fanzeyi
    fanzeyi
    Nov 20, 2014
    12


    Chrome 拯救你。
    typcn
    typcn
    OP
    Nov 20, 2014
    13
    @fanzeyi 这个。。。。让访客慢一些啊 我速度无所谓

    主要我有强迫症 完美主义
    Livid
    Livid
    MOD
    PRO
    Nov 20, 2014
    14
    速度快是好事情啊。
    typcn
    typcn
    OP
    Nov 20, 2014
    15
    @Livid 看来我需要换一个简单快速动画类型了
    mhycy
    mhycy
    Nov 20, 2014
    16
    好快的服务器....
    hcymk2
    hcymk2
    Nov 20, 2014
    17
    @typcn
    让访问首页的时候先 模拟一个点击事件。
    xoxo
    xoxo
    Nov 20, 2014
    18
    setTimeout(function(){...}, 1000);
    typcn
    typcn
    OP
    Nov 20, 2014
    19
    @hcymk2 啊?提前载入?
    typcn
    typcn
    OP
    Nov 20, 2014
    20
    @xoxo 在电脑上的话 500比较合适,但是在手机上 1000比较合适,没法判断设备的性能,怎么办

    我强迫症
    justplaymore
    justplaymore
    Nov 20, 2014❤️1
    21
    用promise来实现,参阅jQuery的deferred对象
    http://www.ruanyifeng.com/blog/2011/08/a_detailed_explanation_of_jquery_deferred_object.html
    $.ajax(...).done(...).done(...);

    将异步流程改成顺序执行,而不应该从时间轴上去取巧,异步时间轴是不可预测的。
    tmkook
    tmkook
    PRO
    Nov 20, 2014
    22
    加个时间统计,1秒以内就延迟1秒,如果超过1秒就不延迟
    jasonslyvia
    jasonslyvia
    Nov 20, 2014
    24
    一堆人出馊主意,楼主明显是舍本逐末啊,为了显示动画而显示动画,根本就失去了加载动画的原本用意……
    fengchang
    fengchang
    Nov 20, 2014
    25
    典型的没有需求制造需求。别人都是因为加载太慢怕用户失去耐心才做加载动画,你速度这么快做什么动画。
    typcn
    typcn
    OP
    Nov 20, 2014
    26
    @jasonslyvia
    @fengchang 解决了 我有强迫症 想让慢网络和快网络能一样,加了个动画。。
    lygmqkl
    lygmqkl
    Nov 20, 2014
    27
    setTimeout 把压力方到客户端。 其实这种东西 会审美疲劳的。。。每次都放,然后也没读出多少数据来。。。用户会想,好烂的服务器啊。
    typcn
    typcn
    OP
    Nov 20, 2014
    28
    @lygmqkl 我已经解决了这个问题 ,你可以点击链接访问一下试试效果
    yanleijava
    yanleijava
    Nov 20, 2014
    29
    sucess里面 sleep
    justplaymore
    justplaymore
    Nov 20, 2014
    30
    好吧解决了 又离 Callback hell 近了一步

    给 loader.show() 加了一个callback参数

    在 OnAnimateEnd 的 Callback 中 执行show事件的callback

    ==========================

    额,避免用callback写法,promise就是用来解决callback hell的,用deferred对象的resolve和reject方法来处理执行状态,可以避免callback依赖,只改变deferred对象的状态,前面的链接里文章讲得很清楚了。
    p2p
    p2p
    Nov 20, 2014
    31
    数据获取 加callback

    太快时再加延迟,保证你的动画有机会涨姿势
    typcn
    typcn
    OP
    Nov 20, 2014
    32
    @p2p 不是。。。我是怕页面已经加载完动画才播放,我不希望用户看到DOM变化,在动画播放的0.5秒内加载页面而不是还没开始播放就在0.1秒内加载完了页面,,。。。
    Phariel
    Phariel
    Nov 20, 2014
    33
    不要陷入callback hell, 前端现在都是promise封装。你先学习一下promise的理论知识,然后用这个https://github.com/cujojs/when 这算一个比较好的promise实现库,当然jQuery也有promise的实现,任君选择。
    lygmqkl
    lygmqkl
    Nov 20, 2014
    34
    帮你抓个bug, Mac os x, Safari 点入一个主题,可以成功打开,然后使用后退按钮无效。
    aiguozhedaodan
    aiguozhedaodan
    Nov 20, 2014
    35
    楼主你博客的速度真的好快……
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Privacy   ·   Solana   ·   1327 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 55ms · UTC 21:52 · PVG 05:52 · LAX 13:52 · JFK 16:52
    ♥ Do have faith in what you're doing.