タグ

非同期処理と通信に関するlocke-009のブックマーク (2)

  • JavaScriptを使った非同期通信について - Qiita

    はじめに こちらの記事ではWEB開発における非同期通信について理解しやすいように手を動かして作れるアプリを作りました。 非同期通信について学んでみたい人はぜひ作ってみてください。 対象者 非同期通信とはなにかわからない、または名前だけ知っている、漠然としたイメージだけあるといった方 WEB開発に関する知識はある程度持っている方 非同期通信とは 非同期通信とは通信技術の一つで送信者のデータ送信タイミングと受信者のデータ受信タイミングを合わせずに通信を行う通信方式です。 イメージが湧きにくいと思うので以下の画像を見てください。 この処理ではボタンをクリックした後、画面遷移を行わずにデータベースへアクセスしランダムなポケモン情報を画面に表示しています。 非同期通信では処理は以下のように行われています。 送信ボタンをクリックするとJavaScriptにてhttpリクエストが送信され、サーバーサイド

    JavaScriptを使った非同期通信について - Qiita
  • 非同期通信をするなら絶対にやったほうがいいこと - Qiita

    TL; DR ユーザーを待たせるとき、「どのように待たせるか」によって印象は結構変わります。 非同期処理などでユーザーを待たせるときは、適切なローディングを表示してUXを改善しましょう。 違いを体感していただけるよう、いくつかの例を元に書いてみました。 ボタン押下の例 送信ボタンを押してから、通信に1秒かかるお問い合わせフォームを作ってみました。 2つの例を比べてみて下さい。 実際には何も通信しないダミーのFORMなので、気軽に試して下さい。 Bad See the Pen ダミーFORM by laineus (@laineus) on CodePen. Good See the Pen ダミーFORM by laineus (@laineus) on CodePen. 改善されたこと1 ユーザーの操作に対し、画面が即時応答するようになりました。 結果: 体感速度が向上しました。 どちら

    非同期通信をするなら絶対にやったほうがいいこと - Qiita
  • 1