同期・非同期通信の違い

・３行で要約します

同期通信では、受け取ったHTMLを表示させるため、ブラウザではページ全体を再読み込みします。
Ajaxを用いた非同期通信のレスポンスでは、JSON形式のデータそのものを返しています。
データそのものを受け取って、ページの一部分のみを更新するため、ブラウザでページ全体を再読み込みしなくてよい

レスポンスで返される内容が違う

同期通信のレスポンスでは、ビューファイル（index.html.erb）をもとに生成されたHTMLを返していました。
受け取ったHTMLを表示させるため、ブラウザではページ全体を再読み込みします。

非同期通信のレスポンスでは、JSON形式のデータ（ページの一部分）を返しています。

非同期通信を実装することでよりよい応答性、操作性を実現できる
データの読み込みなどの待ち時間の短縮