รายงาน State of CSS 2021

• แบบสำรวจผู้ตอบ 8,714 คนทั่วโลก

• การนำความสามารถใหม่ของ 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%

[xguru]

รายงาน State of CSS 2020 https://th.news.hada.io/topic?id=3304