V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
seaofbits
V2EX  ›  前端开发

谷歌这个网页的效果真是惊艳到我了!有无 v 友知道是如何实现的呢?

  •  
  •   seaofbits · 108 天前 · 2975 次点击
    这是一个创建于 108 天前的主题,其中的信息可能已经有所发展或是发生改变。

    url 如下:

    https://www.google.com/search/howsearchworks/our-history/

    目前发现的是,它套了一层 iframe 指向另一个网页,但是该网页再 F12 就只能看见一个 canvas 了……

    不知道这个网页是用什么技术实现的呢? v 友们有无想法?欢迎大家畅所欲言。

    14 条回复    2022-07-13 15:56:10 +08:00
    seaofbits
        2
    seaofbits  
    OP
       108 天前
    我也看了 https://gweb-searchon.uc.r.appspot.com/timeline/assets/js/app.js 这个 js ,但是感觉它引用的两个开源库都还差点意思:
    goober 是 css-in-js ,肯定是辅助;
    theatre-js 是一个动画库,这个沾边了,但是它也不能直接创建如此丝滑的线条[捂脸]
    我感觉应该还少了一点东西,可能是个 3d 库?
    Routeros
        3
    Routeros  
       108 天前
    惊叹,还适配了移动端。
    Senorsen
        4
    Senorsen  
       108 天前
    题外话:刚刚不知咋了页码一直红白闪烁,频率特别高。好像是几个小时前开了一直放那儿忘记关,再切回来就有 bug 的样子。。
    kingxiangqi
        5
    kingxiangqi  
       108 天前
    盲猜 WebGPU
    foam
        6
    foam  
       108 天前
    我也看了 app.js 。里边有个 active theory 的网址,看了下他们的文章,他们是专门做交互式动画应用的

    https://medium.com/@activetheory
    est
        7
    est  
       108 天前
    现在的小朋友呀。。。

    以前在 Pentium III 上看 Flash 比这效果惊艳得多。

    而且 swf 格式还有个牛批的特性是边下载边看。。。这个网页 4.7MB 。。。就这?

    真的拉夸!

    而且当年最强大的就是 Macromedia 那个编辑器,让普通人也能做动画和特效。
    dingwen07
        8
    dingwen07  
       108 天前
    帧率有点低
    seaofbits
        9
    seaofbits  
    OP
       107 天前
    @est 哈哈,flash 是上一个时代的荣光。我也用 flash 做过一点动画(火柴人水平那种😀)

    这个网页我觉得最不可思议的地方就是那个跟随滚动条播放的流畅线条,做成这样我觉得已经是 h5 典范作品了🐮同时也是最好奇这个是怎么做的
    wtf12138
        10
    wtf12138  
       107 天前
    同好奇,有没有大佬讲一下思路
    est
        11
    est  
       107 天前
    @seaofbits 火柴人水平那是相当好了。我记得火柴人最后一幕居然是 3D 展现的。。。。
    seaofbits
        12
    seaofbits  
    OP
       107 天前
    @est 倒不是那个火柴人,我看过那个火柴人,那是火柴人天花板😂我做的是很简单的那种动画😃
    est
        13
    est  
       107 天前
    @seaofbits 哈哈哈
    WORUI
        14
    WORUI  
       84 天前
    真的是令人惊艳!
    关于   ·   帮助文档   ·   API   ·   FAQ   ·   我们的愿景   ·   广告投放   ·   感谢   ·   实用小工具   ·   1230 人在线   最高记录 5497   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 44ms · UTC 00:03 · PVG 08:03 · LAX 17:03 · JFK 20:03
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.