V2EX = way to explore
V2EX 是一个关于分享和探索的地方
Sign Up Now
For Existing Member  Sign In
• 请不要在回答技术问题时复制粘贴 AI 生成的内容
inktiger
V2EX  ›  程序员

现在那种前端网页页面 className 看起来是随机的是如何实现的

  •  
  •   inktiger · Aug 14, 2020 · 3728 views
    This topic created in 2089 days ago, the information mentioned may be changed or developed.

    我是一名后端,今天在 facebook 源代码看到页面的 className 感觉全是随机取的,好像近来这种方式的网站不少,这个是如何实现的呢?这种对 seo 友好吗,这种做法有什么好处和坏处呢

    img

    13 replies    2020-08-15 06:42:18 +08:00
    way2explore2
        1
    way2explore2  
       Aug 14, 2020   ❤️ 1
    因为他们用 react
    inktiger
        2
    inktiger  
    OP
       Aug 14, 2020
    @way2explore2 噢噢,原来是这样,感谢感谢
    ayase252
        3
    ayase252  
       Aug 14, 2020 via iPhone
    webpack 构建的时候 css-loader hash 一下
    linkopeneyes
        4
    linkopeneyes  
       Aug 14, 2020
    webpack 打包的时候 hash 了一下
    w3313003
        5
    w3313003  
       Aug 14, 2020
    css-module
    momocraft
        6
    momocraft  
       Aug 14, 2020
    各种 css-in-js 或者 css module
    zhuweiyou
        7
    zhuweiyou  
       Aug 14, 2020
    这不是“人工”写上去的,工具处理成这样的,是为了不同文件用重复的 class 名,不会冲突。
    hb751968840
        8
    hb751968840  
       Aug 14, 2020
    vue 的 scope 和 css in js
    P233
        9
    P233  
       Aug 14, 2020
    facebook 网站上这个还不太一样, 一个 css 属性, 对应一个 class,atomic css
    HFX3389
        10
    HFX3389  
       Aug 14, 2020   ❤️ 1
    这种网页对爬虫是不是不怎么友好~~
    tao1991123
        11
    tao1991123  
       Aug 14, 2020
    css-module
    MegrezZhu
        12
    MegrezZhu  
       Aug 14, 2020   ❤️ 1
    从目的角度来说,有的网站这么做是为了给 adblock 用户添堵…
    joeybuddy
        13
    joeybuddy  
       Aug 15, 2020
    styled-components 也是这个效果。好处就是不需要费脑子去想样式名称并且作为组件不容易有样式污染。而且在组件化开发的时候,组件名称本身表示了语义化的信息,费力给 CSS 起名字有点累赘
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   2653 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 49ms · UTC 14:39 · PVG 22:39 · LAX 07:39 · JFK 10:39
    ♥ Do have faith in what you're doing.