​​なぜ、脱jQueryが叫ばれるか

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

​​木村 哲朗
​​
​​
 
User-uploaded image: cover.svg
​​
​​

​​この資料の役割

  • ​​脱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 でだいたい対応できる（ハズ
​​