2024年11月2日に、GitHubで働いた経験もあるフロントエンドエンジニアであるMu-An Chiou氏が書いた「JavaScriptのDo’s and Don’ts」というブログ記事が海外で注目を集めている。この記事では、JavaScriptを適切に活用するための指針について詳しく紹介されている。
以下に、その内容を紹介する。
Do - JavaScriptを使用すべき場合
- HTMLだけで機能を実現できない場合:基本機能がHTMLだけで動作しないときにはJavaScriptを使用すべきである。
- JavaScriptを加えることで機能が向上する場合:基本はHTMLで構築し、必要に応じてJavaScriptで段階的に強化する。例えば、単純なテーブルはHTMLのみで構成し、ソート可能なテーブルにはJavaScriptを少しだけ追加するのが理想である。
- HTMLで必要なUIパターンが存在しない場合:チェックボックスや選択要素で代替できないか検討し、それでも不可欠な場合にのみカスタムのJavaScriptを使用する。また、HTMLでこのパターンが存在しない理由(技術的負債、ブラウザ互換性、メンテナンスコストなど)を理解する必要がある。
- 標準HTMLでアクセシビリティが確保できない場合:例えば、ARIA属性(
aria-expanded
など)で状態の変化を示す必要がある場合には、アクセシビリティを確保するためにJavaScriptを使用するべきである。その際、a11ysupportでアクセシビリティのサポートを確認する。 - CSSでインタラクティブな動作を実現しようと考える場合:CSSだけでインタラクティブな動作を試みても、95%のケースでアクセシビリティが確保されないため、JavaScriptを使用する方がよい。
Don't - JavaScriptを使用すべきでない場合
上記以外のすべての場合。
追記(2024年11月12日)
Mu-An Chiou氏は、深夜に書かれたこの記事が予想以上の注目を集めたため、補足としてGitHubのフロントエンドチームでの経験についても述べている。
GitHubでは、初期から「JavaScriptは2005年当時のように書く」という方針が存在しており、かつてはjQueryをはじめとする依存ライブラリを削減し、最終的にはゼロにすることを目指すという方針を採用していた。しかし、Reactが導入されると状況は一変してしまい、現在のフロントエンド開発では多くの「必須知識」とされる技術やフレームワークが存在する。
彼は、それらは本質的にはオプションに過ぎないと述べている。
彼は「フロントエンドフレームワークに関する知識がなくともウェブプラットフォームの知識があれば問題ない」とし、本質的なウェブ理解が採用において重視されるべきだと述べている。また、JavaScriptの過剰な依存による開発の複雑化と、初心者の障壁が不要に高められている現状に対する失望も語っている。
(編集者による補足: 彼のプロフィールには「アンチJavaScript-JavaScriptクラブのいち員であるという記載がある )
詳細は[JavaScript dos and donts @ Mu-An Chiou]を参照していただきたい。