Ajaxの使いどころと例外処理について考察

ぜひ意見をください( ´ ▽ ` )ノ
初めは「Ajaxが使えるぞ!」って意気揚々と調べてたんだけど、もしかしたら何にでも使うべきじゃないかも?

※親切なWeb系のお兄さんと話した内容を追記しました (2017/10/08)

そもそもの背景

現場のWebアプリでAjaxを使えることになりそうなので、新機能のうちAjaxを使えるところはそうしたい!
のだけど、Ajax/ 丸ごとリロードの切り分けとか、サーバー側で例外が起きた時の対応がよくわからない。
とりあえずは調べたことをまとめたい。

Ajaxの使いどころ

ちょっとした処理から決済まで重要度を問わずに使えるけど、DOMをゴリゴリ操作するのであれば生Javascript/JQueryはオススメできない。

2000年代の記事では以下のような必要最小限の使い方に抑えているのが多いイメージ。
1. 業務フローの本筋以外で通信が必要なところ
・チャット
SNSへのシェアや認証時のパズルなど
・検索結果など、リストに対するフィルターやソート
・自動補完
2. ダイナミックな動きが欲しいところ
インクリメンタルサーチ

その後フロントエンドのフレームワークが出てきて状況変わったってことかな?

この辺は現場のフロント事情を鑑みて決める(jspみたいなテンプレートエンジンの資産がたくさんあるなら、DOM操作にReactは導入できないよね?)のが良いと思われる。

サーバ側の例外の扱い

最初からやり直させた方がよければ例外ページ、続行させた方がよければページ内のアラートで警告

  1. 最初からやり直させた方が良いケース
    ・決済処理など重要な処理
    → エラーページにリダイレクトさせ、初めからやり直すことを促す。

  2. 続行させた方が良いケース
    ・入力補完やコンボボックスの選択肢など、表示されなくてもユーザーが処理を続けられる場合
    ・リトライしてほしい場合
    → ページ内にエラーメッセージを表示する(例:Twitterでツイートが投稿できない場合など)

参考サイト

Alex Bosworth's Weblog: 10 Places You Must Use Ajax
たくさん引用されているサイト。Ajaxを使うべき6ケースと使わないべき4ケース。ただし昔の記事。

おさかなラボ - 6 Places You Must Use Ajax
↑の記事の内容を間接的にわかりやすく引用してくれている日本語のブログ

How to use AJAX: 5 Real World Examples - Moz
割と最近のAjaxユースケース