天天看點

好程式員分享如何看待CSS中BEM的命名方式?

  好程式員分享如何看待CSS中BEM的命名方式?BEM的意識就是塊(block)、元素(element)、修飾符(modifier),是由yandex團隊提出的一種CSS Class命名方法。

  任何一個東西的存在都有其存在的道理,如果他毫無價值,那麼肯定會被淘汰,後人可能都不了解,甚至都不會出現在後人的世界裡。

  關于BEM命名其最大的争議就是其命名風格,它鼓勵一級一級的寫的非常具體,但是會很長。如此常的命名會影響書寫效率,名稱過長代碼量就會增多,檔案體積就會變大(在gzip下這個不算是個問題),進而會影響傳輸速度,使用者體驗度就低,但是作為一個職業人我們都不能單純把個人喜好和習慣作為借口來拒絕或否定其用途。

  風格對于使用者來說并不是很重要,關鍵的是看其效果。正所謂人們常說的“不看療程,看療效”。

  從擴充性上來看,嵌套過多閱讀性差,超過3層就很難閱讀了;嵌套越多,選擇器的層級也會随之增多,那麼性能不知不覺就會變差;如此長的名字,書寫上想沖突都難。

  從程式設計原則上來說,這種命名方式不會暴露抽象類。假如樣式變了需要繼承另一個抽象類,不需要改HTML,隻需要改css即可。

  團隊開發中,風格無非是一種形式,可以限制人們達到一定程度上的統一。内部溝通會極大降低溝通成本。

  BEM命名的方法雖然有自身的不足之處,但至少他可以使我們命名的時候達到一定的統一,我們可以學習其優秀的方面将其納為己用。在實際項目開發中将其巧妙而又靈活的運用起來也未嘗不是一件壞事。

繼續閱讀