なぜ、脱jQueryが叫ばれるか

まぼろしのJS勉強会 #6 「知ってトクする周辺知識」

木村 哲朗
 
 

この資料の役割

  • 脱jQueryを叫ぶ人がいるのはなぜなのかを説明
  • 脱jQueryの価値を説明
  • 技術的分断についての議論を提起
 

jQuery ≠ 😈

  • だって簡単で便利じゃん
  • プラグインめっちゃあるし
  • 「普通のウェブページ・サイト」に枯れた技術を用いるのは合理的
 

DOM APIの進化と古いIEの退場 🎉

  • querySelector()/querySelectorAll()によりDOM取得は平定された
  • classListによりクラスの付け替えが標準化された
  • サポート終了のためIE8/9/10がインターネットから退場した
  • ブラウザ間のJSの互換性が大幅に改善
  • CSS Transition/Animation の一般化

jQueryが持つ強力な互換能力がかえってオーバーヘッドに…
 

jQueryが😈と化すとき

  • Angular/React/Vueなどのフレームワーク or ライブラリ
  • 状態の写像としてDOMを生成する
  • jQueryはDOMに直接作用する
  • 写像が壊れてしまう

フレームワークに乗っかりたいとき、jQueryは💪マッチョすぎる。
 

いつフレームワークに乗っかりたいか 🤔

  • 画面の大半を非同期かつ動的に構築する場合
  • SPAだけじゃないよ
  • 同じコンポーネントをあちこちで繰り返し使う場合
  • 複数のUIが相互に依存して統合的な状態管理が必要な場合
  • ユーザー入力とサーバー上のデータを高度に同期させたい場合
  • 継続的な機能の追加・拡張を見込んでいる場合

状態の操作に集中できるフレームワークやライブラリを使った方が全然ラク 😎
 

🙋‍♀️ jQueryを使う人 ≠ DOM操作したい人 🙅‍♂️

  • DOM操作をしたくない人
  • → Angular/React/Vueなどのフレームワーク or ライブラリを利用
  • DOM操作をしたい人
  • → jQueryを使う人、ではない
  • 標準の DOM API でだいたい対応できる(ハズ