ブラウザ君「ワイはCSSのセレクタを右から読むんや」 - Qiita

ある日のやめ太郎一家 娘（3歳）「パパ、レンダリング最適化されたCSS書いてる？」 ワイ「なんやレンダリングって」 娘「ブラウザがWebサイトを描画することだよ」 ワイ「ああ、そのレンダリングか」 ワイ「よう知っとるわ」 よめ太郎「（CSS関係で他にどんなレンダリングがあんねん）」 よめ太郎「（また知ったかぶりしとるわ）」 ワイ「ワイはいつも描画速度を意識してCSSセレクタを書いてるで？」 ワイ「例えばWebサイトのヘッダ部分にある、サイト名のところにスタイルをあてる場合で・・・」 ワイ「↑こんな風にセレクタを書いてやるんや」 ワイ「そしたらブラウザ君は」 ブラウザ君「このページの中で、header要素は・・・お、この1つだけやな」 ブラウザ君「ほんで、その中のdiv要素は・・・この1つだけやな」 ブラウザ君「ほんで、更にその中のa要素は・・・この1個だけやな！」 ブラウザ君「特定しやすい

[asiamoth]

最後、それなら全ての要素に直接style属性を書き込んだ方がメッチャ早いのでは!?（HTML4の<font>脳）

[style_blue]

前から人が作ったCSSをあれこれいぢりながら何でこーゆー命名してるんだろうかと思うクラスやCSSの書き方があったんだけどBEMってやり方があるのね。なるほど勉強になった。あとこのシリーズ面白い。

[toshi-toma]

ワイとブラウザ君のやりとりが面白いからスラスラ読めて分かりやすい

[mimosafa]

おもしろい

[d4-1977]

結局、BEM落ち？いや、オチ？

[daichirata]

これも猛虎弁の一種よな

[nijitaro]

なるほど！と同時に、Vue で style 書くとコンポーネントIDみたいなのがセレクタの一番右につくやつは、コンポーネント外に干渉しないだけじゃなく速度も考慮されてるのかな。偉すぎるな。

[shinoppie]

へー

[endok]

掛け合いが良い。

[letsspeak]

文字比較の回数とか必ずしもBEMが最短とも言えないような気がするけどCPUとか詳しく無いから分からん。誰か教えて

[kenichi_odo]

BEMですね

[tsuki-rs]

BEMだったわｗ

[UDONCHAN]

へぇ

[cowbee]

“BEM”