吐槽一下百度贴吧的链接

[mikac]

看了下 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

[qiayue]

多个 CSS 文件合并成一个请求，淘宝也大量使用这种形式，不过 URL 不一样

[mikac]

@qiayue 这个链接每个 CSS 文件名字看起来都是动态的，难道他们后台是实时拼接这样一个 css?

[shoaly]

后台肯定是多个 @import, 然后自动拼接的.... 这样的好处是 cdn 那边就简单了.....

[nine99]

并不是每次都拼的，有 cache 的

[Kokororin]

Tengine concat 模块

[mikac]

@shoaly 还跟 cdn 有关，不明觉厉

[mikac]

@nine99 可能我理解错了，文件名后面可能是版本号，这样就可以 cache 了

[mikac]

@Kokororin 正解，看来是通过 Tengine concat 模块来减少 http 请求数量，从而加快页面载入速度。

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

不知道放在 Nginx 层会比这种直接合成有什么优势

[nine99]

@mikac 应该是全自动的吧，能够把页面内的 css 自动合并，并且改 html 里面的 css 的地址。如果不是这样，那反而开发的时候很麻烦，推版本的时候，还得改 css 的地址。

[nine99]

@nine99 再有就是这个功能下沉了，以至于开发的时候不用管这事，那些历史遗留项目也可以直接获得这个特性。

[mikac]

@nine99 听你这么一分析，感觉清晰了不少。

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

对于遗留项目，这确实是个不错的选择。除了路径有点丑，有点长 :)