kechx
V2EX  ›  问与答

弹幕实现技术(后台)

  •  
  •   kechx · May 27, 2015 · 14737 views
    This topic created in 4080 days ago, the information mentioned may be changed or developed.

    这里是把每个人发的弹幕实时的显示出来,开始以为是Ajax,一想不对劲,如此大量的请求和和实时显示怕是不行,打开控制台一看,果真不是。

    后来搜到了是 websocket,基于web的socket协议。对于需要实时更新的产品来说确实是一种福音,如股票,web聊天。

    有没有哪些网站用到了这种技术?

    31 replies    2015-05-28 12:18:56 +08:00
    hging
        1
    hging  
       May 27, 2015
    弹幕嘛. 就相当于聊天室嘛在后台来看. (个人感觉.
    herold519
        2
    herold519  
       May 27, 2015
    感觉想多了 弹幕其实说白了就是一个留言板根据视频播放时间滚动播出。。
    Septembers
        3
    Septembers  
       May 27, 2015
    吧TA想象成 动 态 字 幕
    lincanbin
        4
    lincanbin  
       May 27, 2015
    实时消息推送基本都是websocket,例如百度贴吧和知乎的实时回复消息的推送。
    lincanbin
        5
    lincanbin  
       May 27, 2015
    百度贴吧是不是websocket我也不确定了,可能是长连接也可能是websocket
    m939594960
        6
    m939594960  
       May 27, 2015
    斗鱼弹幕 flash socket 然后调用JS 输出到网页
    acfun弹幕 一个XML文件 类似
    [1:12]老司机带带我
    [2:12]大家不要吵了给我王者小弟一个嘴巴子
    kechx
        7
    kechx  
    OP
       May 27, 2015
    @herold519 @Septembers 那要是动态字幕一下子很多很多呢。ps:动态字幕又是怎么做到。
    kechx
        8
    kechx  
    OP
       May 27, 2015
    @m939594960 你说的这两种技术,低版本浏览器的支持怎么样?
    TangMonk
        9
    TangMonk  
       May 27, 2015
    socketio sockjs现成的
    hging
        10
    hging  
       May 27, 2015
    @RihcardLu 嘛-.- 题目说是后台. 其实还是前台嘛. 前台现在都是flash做的. 再低端的浏览器只要有flash就一样的呈现哟.
    kechx
        11
    kechx  
    OP
       May 27, 2015
    @lincanbin websocket好像是11年才写到标准里的。
    kechx
        12
    kechx  
    OP
       May 27, 2015
    @TangMonk thanks,我去查查
    Septembers
        13
    Septembers  
       May 27, 2015
    @RihcardLu 后端本质上储存的是一个 弹幕序列,如果同一时间片段内有其他的人发 弹幕 就广播出来
    m939594960
        14
    m939594960  
       May 27, 2015
    @RihcardLu 第一种是直播用的 实时性 比较高! flash做的基本不会有兼容闻听
    第二种主要i应用于视频
    兼容性也没问题 因为也是基于flash的
    typcn
        15
    typcn  
       May 27, 2015
    @m939594960 Flash 做的非常有兼容问题,全部手机不支持,Macbook 相当发热等。
    另外:V2 好多人已卸载
    kechx
        16
    kechx  
    OP
       May 27, 2015
    @typcn 斗鱼,土豆弹幕都支持手机,那是怎么做的呢?
    typcn
        17
    typcn  
       May 27, 2015
    @RihcardLu 他们是单独做了手机 APP
    ipconfiger
        18
    ipconfiger  
       May 27, 2015
    就是把实时刷新的聊天室横过来显示在视频的上一层而已了啊
    paloalto
        19
    paloalto  
       May 27, 2015
    paloalto
        20
    paloalto  
       May 27, 2015
    上面链接多了个句号 http://www.perber.com/
    kxxoling
        21
    kxxoling  
       May 27, 2015
    HTML5 弹幕的话如何解决性能问题?屏幕上几百条滚动弹幕压力很大的吧?
    shiznet
        22
    shiznet  
       May 27, 2015 via iPhone
    @kxxoling web端应该没压力吧,传过来的不过是纯文本。
    kxxoling
        23
    kxxoling  
       May 27, 2015
    @shiznet 几百个元素的动画效果,应该会很吃 CPU 吧?现在的 CSS3 动画貌似很占资源。(或者用 canvas?这个不了解。)
    hjc4869
        24
    hjc4869  
       May 28, 2015
    直播弹幕用长轮询,回放弹幕用xml。
    paloalto
        25
    paloalto  
       May 28, 2015   ❤️ 1
    @shiznet 纯文本的动画也会消耗性能的。即使是用 translate3d 做位移,几十条、几百条同时移动风扇也会受不了。
    @kxxoling 用 canvas 做可能会好很多。
    yangff
        26
    yangff  
       May 28, 2015 via Android
    kxxoling
        27
    kxxoling  
       May 28, 2015
    @yangff 这个我知道,不过看不懂复杂的 JS 模块=。=能讲解一下性能上的思路吗?
    yangff
        28
    yangff  
       May 28, 2015 via Android   ❤️ 1
    @kxxoling 我记得还是css和svg,canvas在字体上有问题。以及其他各种问题。。

    https://github.com/jabbany/CommentCoreLibrary/issues/13
    abcfyk
        29
    abcfyk  
       May 28, 2015
    @hjc4869 长轮询性能消耗如何?
    kechx
        30
    kechx  
    OP
       May 28, 2015
    @abcfyk 相当于过几秒钟访问一次,如果直播可能访问的更加频繁。
    celon
        31
    celon  
       May 28, 2015
    用websocket注册广播明显比长轮询要高效啊
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   5872 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 47ms · UTC 02:03 · PVG 10:03 · LAX 19:03 · JFK 22:03
    ♥ Do have faith in what you're doing.