Developer Roadmapは、文字通りエンジニアのロードマップとして有名かと思います。
普段は業務に直接関連しない技術に触れる機会がないため、こういうものでキャッチアップしていきたいです。
今回は、2023年版のFrontend Developer Roadmapを、過去の版と見比べつつ見ていこうと思います。
2023年版がこちらです。
2020年版がこちらです。
HTML
Writing Semantic HTML, AccessibilityがRecommendationにランクアップしています。
ぱっと見の見た目が整っていれば良いという時代から、機械からの読みやすさ・ハンディキャップを持つ方からの読みやすさ（読み上げなど）にも注目されるように移り変わったことがわかります。
Package Managers
pnpmが増えた一方、yarnがAlternativeに格下げされています。
npmの性能が上がったことで、yarnの必要性が減ってきたものと思われます。
Pick a Framework
ロードマップ上で、Pick a Frameworkが前の方に移動しています。
これらの採用がますます一般的になったようです。
Svelte・Solid JS・Qwikが追加されています。
この3点は、State of JSでも最上位にランクインしています。
https://2022.stateofjs.com/en-US/libraries/front-end-frameworks/
ReactがRecommendationなのは変わらないようです。
現状の最有力候補はReact、次世代の可能性がSvelte・Solid JS・Qwikという感じのようです。
CSS
CSSに関する項目（Modern CSS、CSS Frameworks、Writing CSS）についてはかなり変わっています。
2020年版ではCSS in JS（Styled Components、CSS Modules）やReactstrap、Material UI、BootstrapがRecommendされていますが、2023年版では全てなくなっています。
2023年版では、Tailwind・Radix UI・Shadcn UIのみになっています。
変化が大きいですね...。
Module Bundlers
webpackから、Vite・esbuildにRecommendationが変わっています。
実際開発環境のビルドが爆速に変わるので、重要な変化ですね。
webpack後継のturbopack等は触れられていませんでした。
Server Side Rendering(SSR)
React > Remixが増えています。気になります。
Static Site Generators
Next.js・GatsbyJSから、AstroにRecommendationが移行しています。
GatsbyJSに至ってはなくなってしまっています。
Developer Roadmapのサイト自体、Astroで作成されているそうです。
Desktop Applications
RecommendationがElectronなのは変わりませんが、Tauri・FlutterがAlternativeに追加されています。
Web Assembly
2023年版ではBonus Content内に移動しています。
注目度が下がっているのでしょうか？
まとめ
2020年からの変化があらかた確認できました。
聞いたことない項目も複数あり、今後キャッチアップしていきたいです。
