ウェブ業界の当たり前だと思っていることでも、同業他社の人には違う常識があるかもしれません。自分が業界多数の傾向と違うところはどこなのか・・・ この連載ではアンケートデータから国内のウェブ業界の傾向を分析します。
連載第5回目となる本記事ではウェブ業界の「フロントエンドエンジニアにとっての2019年」と題してアンケート結果を紹介します。
JSでブラウザ挙動をどうやって防ぐ？
ウェブページでインタラクションを作るときに、ブラウザのデフォルト挙動が邪魔になることがあります。たとえば、aタグのリンクはJavaScriptでキャンセルでき、自前の処理に置き換えることができます。
ブラウザ挙動のキャンセルのやり方にはさまざまな手段があるのですが、主流のやり方はどれでしょうか？ addEventListener()メソッドやonclick属性のイベントについて質問しました。
187票の回答があり「return false;」が14%、「event.preventDefault();」が82%、「その他」が4%でした。
JavaScriptエンジニアは明示的なevent.preventDefault();を使うことが多いようです。return false;は過去の互換性のため仕様に残っていると思うのですが、暗黙的な挙動でわかりづらいですよね。
コラム：ReactやVueユーザーはテンプレート側にJSを書くのか？
JSXやテンプレートのHTMLにおいて、デフォルト挙動のキャンセルのために、ネイティブのon属性等を仕込むのはありでしょうか？ React、Vue、Angularユーザーに質問しました。
234票の回答があり「いいよ」が14%、「だめ」が58%、「どっちでもいい」が18%、「javascriptのみ許す」が10%でした。
個人的にはテンプレート側にJavaScriptが混じるのは分離ができておらず、ベストプラクティスではないと思っています。詳細は記事『React/Vue/AngularでDOMのonやhrefにJavaScriptのソース文字列を使うのはアリか？ - Qiita』にまとめたので、あわせて参照くださいませ。
Vue.jsの定番のUIフレームワークはどれ？
人気のJavaScriptフレームワーク「Vue.js」。Google提唱のMaterial Designを実現するUIフレームワークがたくさんあり、簡単なコードでイマドキなUIをサクッと作れます。どのUIフレームワークがもっとも使われているのでしょうか？
60票の回答があり「Vue Material」が45%、「Vuetify」が47%、「MDC Integration」が2%、「Material Components Vue」が6%でした。
Vue MaterialとVuetifyの人気が横並びといった状況でしょうか。
おもしろいことに、海外でVue.jsでのマテリアルデザインについて考察されている方がいたのですが、なんとあのジョン・マエダ氏でした。彼はデザインとテクノロジーの融合を追求する第一人者ですが、あれほどの方も現場のツールについて調べることもあるのですね。
Gruntって今も使っている人、いるの？
Gruntはかつてフロントエンドエンジニアの制作効率化に革命を起こしたツールでした。今はGulpをはじめ他のツールに役割を奪われている状況ですが、現在も使っている人はいるのでしょうか？
161票の回答があり「現役で使っている」が2%、「たまに使うことがある」が2%、「もう使わない」が34%、「使ったことすらない」が61%でした。
Gruntはさすがに使うことはなさそうですね。GruntからGulpへ移行するには記事『必ず使うタスクランナーGulpとGruntの基本コード9選』が役立つはずです。
容量節約に役立つ画像形式webpって使っている？
圧縮効率に優れた画像形式webp（ウェッピー）。高圧縮率でアニメーション情報も含められるなど、多くの用途に利用できます。どのくらい利用されているのでしょうか？
643票の回答があり「よく使っている」が2%、「使ったことがある」が12%、「使ったことはない」が49%、「.webpってなに？」が37%でした。
YouTubeをはじめGoogle系のサービスではwebpは利用されています。画像容量が小さくなれば転送量を節約でき、ホスティングの予算削減に期待できます。
大規模なウェブサービスだと費用対効果が見込めますが、日本国内のウェブ制作の現場でwebpをわざわざ導入できるパワーのある開発陣は少ないのかも知れません。
アニGIFより綺麗、APNGって使っている？
APNG（エーピング）とはPNG形式の拡張で、アニメーションを利用できる画像形式です。LINEのアニメスタンプにも採用されるなど、次世代のアニメーション画像形式として、一定のニーズがあります。はたして、ウェブ制作の現場ではどのくらい利用されているのでしょうか？
305票の回答があり「よく使っている」が3%、「使ったことがある」が8%、「使ったことはない」が47%、「APNGってなに？」が42%でした。
ウェブの現場ではAPNGはほとんど利用されていないようですね。
PWAの時代は来るか？
流行の兆しのあるPWA（プログレッシブ・ウェブ・アプリ）。ウェブサイトをホーム画面のアプリとして登録可能にすることで、ネイティブアプリのように振る舞うことができ、訪問率向上を期待できます。
ウェブサイトをホーム画面に登録する人がどのくらいいるのでしょうか？ ユーザー視点の意識を調査してみました。
244票の回答があり「よく使っている」が5%、「たまに使う」が39%、「使わない」が50%、「そんな機能は知らない」が6%でした。
ホーム画面に追加することばかりがPWAではありませんが、この先、PWAはどのぐらい市場に受け入れられていくのか気になります。
人気のJavaScriptライブラリはどれ？
国内で最近人気のあるJavaScriptライブラリ/フレームワークはどれでしょうか。
3204票の回答があり「React」が23%、「Vue」が37%、「Angular」が7%、「jQuery」が33%となっています。
Vueは飛ぶ鳥を落とす勢いで人気を集めており、一番なのも納得の結果です。ただ、ReactよりもjQueryの票が多いのは驚きですね。jQuery案件がいまも国内に多く残っているのでしょう。
まとめ
このようなアンケートは今後も実施していく予定です。興味があれば筆者のTwitterアカウントをフォローいただければ幸いです。今回のアンケート実施にあたり、回答やシェアを多数いただきました。ご協力いただいたことに感謝を申し上げます。
いままでのアンケートでは、CSSレイアウトにはfloatよりFlexboxを利用している人が多かったり、h1要素はページ内に一個だけにしている人が多かったりすることがわかっています。シリーズの記事もあわせて、ご覧くださいませ。
