V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
mikac
V2EX  ›  程序员

吐槽一下百度贴吧的链接

  •  
  •   mikac · 2018-05-27 23:04:25 +08:00 · 2501 次点击
    这是一个创建于 2377 天前的主题,其中的信息可能已经有所发展或是发生改变。

    看了下 https://tieba.baidu.com/index.html 的源码,里面一个 css 的 href 属性值超奇怪。

    首先是两个 ??, 其次是后面这一大串逗号分割的 css 文件名。这得多复杂的场景才能构建出这样的链接……

    真心搞不懂 ):

    https://tb1.bdstatic.com/??/tb/_/card_31c1d0d.css,/tb/_/js_pager_5be1e39.css,/tb/_/login_dialog_f4ae717.css,/tb/_/user_head_35f26e0.css,/tb/_/icons_a2a62be.css,/tb/_/wallet_dialog_b166468.css,/tb/_/flash_lcs_d41d8cd.css,/tb/_/new_message_system_9425a2a.css,/tb/_/base_user_data_aee5fd4.css,/tb/_/cashier_dialog_2230300.css,/tb/_/qianbao_cashier_dialog_8999f13.css,/tb/_/base_dialog_user_bar_008369c.css,/tb/_/qianbao_purchase_member_d2a879f.css,/tb/_/pay_member_d41d8cd.css,/tb/_/http_transform_d41d8cd.css,/tb/_/userbar_f4eb8c0.css,/tb/_/poptip_f0fdc70.css,/tb/_/feed_inject_d41d8cd.css,/tb/_/new_2_index_9b0a69e.css,/tb/_/pad_overlay_ea29d54.css,/tb/_/suggestion_2ee80a5.css,/tb/_/search_bright_62ee7ff.css,/tb/_/top_banner_13dc075.css,/tb/_/couplet_78341bd.css,/tb/_/slide_show_aad29db.css,/tb/_/carousel_area_v3_614f6fa.css,/tb/_/interest_num_v2_fa3eaa9.css,/tb/_/shake_bear_f28994d.css,/tb/_/payment_dialog_title_c0597a0.css,/tb/_/qianbao_purchase_tdou_4b31f54.css
    
    11 条回复    2018-05-28 13:05:34 +08:00
    qiayue
        1
    qiayue  
       2018-05-27 23:06:37 +08:00
    多个 CSS 文件合并成一个请求,淘宝也大量使用这种形式,不过 URL 不一样
    mikac
        2
    mikac  
    OP
       2018-05-27 23:16:22 +08:00
    @qiayue 这个链接每个 CSS 文件名字看起来都是动态的,难道他们后台是实时拼接这样一个 css?
    shoaly
        3
    shoaly  
       2018-05-27 23:52:21 +08:00
    后台肯定是多个 @import, 然后自动拼接的.... 这样的好处是 cdn 那边就简单了.....
    nine99
        4
    nine99  
       2018-05-28 10:15:36 +08:00
    并不是每次都拼的,有 cache 的
    Kokororin
        5
    Kokororin  
       2018-05-28 10:23:46 +08:00   ❤️ 1
    Tengine concat 模块
    mikac
        6
    mikac  
    OP
       2018-05-28 10:47:52 +08:00
    @shoaly 还跟 cdn 有关,不明觉厉
    mikac
        7
    mikac  
    OP
       2018-05-28 10:48:50 +08:00
    @nine99 可能我理解错了,文件名后面可能是版本号,这样就可以 cache 了
    mikac
        8
    mikac  
    OP
       2018-05-28 10:58:05 +08:00
    @Kokororin 正解,看来是通过 Tengine concat 模块来减少 http 请求数量,从而加快页面载入速度。

    不过后台应该可以把这些文件合成一个(比如在编译时期合成),似乎也能达到相同的效果。

    不知道放在 Nginx 层会比这种直接合成有什么优势
    nine99
        9
    nine99  
       2018-05-28 12:15:26 +08:00
    @mikac 应该是全自动的吧,能够把页面内的 css 自动合并,并且改 html 里面的 css 的地址。如果不是这样,那反而开发的时候很麻烦,推版本的时候,还得改 css 的地址。
    nine99
        10
    nine99  
       2018-05-28 12:18:14 +08:00   ❤️ 1
    @nine99 再有就是这个功能下沉了,以至于开发的时候不用管这事,那些历史遗留项目也可以直接获得这个特性。
    mikac
        11
    mikac  
    OP
       2018-05-28 13:05:34 +08:00
    @nine99 听你这么一分析,感觉清晰了不少。

    其实有些 web 框架也可以自动的把 html 上的引用地址 和 编译完成后的文件名对应起来的,

    对于遗留项目,这确实是个不错的选择。除了路径有点丑,有点长 :)
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2545 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 27ms · UTC 15:59 · PVG 23:59 · LAX 07:59 · JFK 10:59
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.