LeeReamond

网页上方的资源加载进度条实现是什么原理?

  •  
  •   LeeReamond · Feb 3, 2022 · 2526 views
    This topic created in 1561 days ago, the information mentioned may be changed or developed.

    如题,今天看到一个 php 后端渲染页面的项目居然点击跳转的时候页面上方会带资源加载进度条,挺好奇原理的。前端路由的话完全由 js 接管感觉做出进度条还可以理解,后端不是点击跳转页面命令的时候浏览器就会刷新页面会话么,为啥它可以做到进度条逐个显示资源加载,然后加载完了再 reload 页面。。。。

    8 replies    2023-04-22 16:07:27 +08:00
    vanton
        1
    vanton  
       Feb 3, 2022
    1 、setInterval

    2 、websocket
    also24
        2
    also24  
       Feb 3, 2022 via Android
    直觉上是 pjax
    HackerJax
        3
    HackerJax  
       Feb 4, 2022 via iPhone
    那是假的
    ch2
        4
    ch2  
       Feb 4, 2022
    首次请求返回一个几百字节的 html ,它主要负责下载 js 等,下载完之后让位出去,用它来实现进度条很简单
    molvqingtai
        5
    molvqingtai  
       Feb 4, 2022 via Android
    假的
    LeeReamond
        6
    LeeReamond  
    OP
       Feb 4, 2022
    @ch2 问题跳转就是 A 标签,我看了一下并没接什么骚气的函数,就是普通的跳转
    lete
        7
    lete  
       Apr 8, 2023   ❤️ 1
    有兴趣的话,可以看看这个 https://github.com/Lete114/page-load-progress
    houchangxiaowang
        8
    houchangxiaowang  
       Apr 22, 2023
    @lete 不错哦,谢谢
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   4458 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 46ms · UTC 10:07 · PVG 18:07 · LAX 03:07 · JFK 06:07
    ♥ Do have faith in what you're doing.