15 ポイント 投稿者 xguru 2021-12-17 | 1件のコメント | WhatsAppで共有
  • 世界中の8714人を対象にしたアンケート調査

  • CSSの新機能導入

→ Layout

⇨ CSS Grid : 83%が使用 (>2020 73%)

⇨ Subgrid : 12.7%が使用 (>2020 6.1%)

⇨ Flexbox : 98.7%

⇨ CSS Multi-column : 38.8% (>33.5%)

⇨ CSS Writing Modes : 15.4%

⇨ aspect-ratio : 37.1% (>22.4%)

→ Shape & Graphics

⇨ object-fit : 69.2% (>60.5%)

⇨ clip-path : 56% (>49.1%)

→ Interactions

⇨ CSS Scroll Snap : 30% (>21.1%)

⇨ pointer-events : 70.5%

→ Typography

⇨ font-variant 20% / initial-letter 28.4% は減少傾向

⇨ line-clamp : 29.5% (>20.3%)

→ Accessibility

⇨ prefers-reduced-motion : 26.7% (>15.8%)

⇨ prefers-color-scheme : 28.6% (>18.8%)

→ Other

⇨ CSS Variables : 84.4% (>74.7%)

⇨ @supports : 46% (>40.6%)

⇨ CSS Containment : 9.6% (>6.4%)

⇨ will-change : 33.5% (~28.8%)

⇨ CSS Comparison Functions min(), max(), clamp(): 62.5% (>47%)

  • 好まれる技術

→ プリ/ポストプロセッサ : PostCSS 91% > SaSS 84% > Stylus 35% > Less 34% > Assembler CSS 26%(新規参入)

⇨ そのほか : Styled Components, Tailwind CSS, CSS-in-JS..

→ CSS Framework : Tailwind 78% > PureCSS 70% > Ant Design 56% > Bulma 54% > Semantic UI 47%

→ CSS-in-JS : vanilla-extract 87% > CSS Modules 86% > Windi CSS 84% > Styled Components 77% > Stitches 76%

  • そのほかよく使われるツール

→ Prettier , Autoprefixter, Stylelint, PurgeCSS, cssnano

→ ブラウザ : Chrome 67.4% > Firefox 46.8% > Safari 23.6 % > Safari iOS 16.8% > Edge 16.5% > Chrome Android 13.6% > Brave 8.8%

最もよく読まれているブログ : CSS-Tricks, Smashing magazine, dev.to, Medium

最もよく見られているサイト : Stack Overflow, MDN, W3Schools

最もよく聴かれているポッドキャスト : Syntax, Shop Talk Show, The CSS Podcast

今年の受賞対象

  • 最も多く採用された機能 : CSS Comparison Functions

  • 最も満足度の高い技術 : PostCSS

  • 最も関心を集めた技術 : CSS Modules

調査対象の情報

  • 英語話者が72%、スペイン語 5.5%、ロシア語 5.3%

  • 年齢 : 24~34 37.8% > 35~44 21.9% > 18~24 7.8% > 45-54 5%

  • 経歴 : 5~10年 22.3% , 10~20年 22.3% > 2~5年 16.6% > 20年以上 7%

  • 会社規模 : 100~1000人 17.1% > 1000人以上 12.4% > 20~50人 10.1% > 50~100人 > 8.5%

  • 年収 : $50~100K 22.7% > $30~50K 14.7% > $100K~$200K 13.6% > $10K~$30K 11.2% > $200K以上 1.9%

  • ジェンダー : 男性 65.4%、女性 8.3%

1件のコメント

 
xguru 2021-12-17

State of CSS 2020 レポート https://ja.news.hada.io/topic?id=3304