宮水の日記

宮水の日記

主に書評や資格取得について記事を書いています。

pusher-js【JSライブラリ1日1個】

JSライブラリを1日1つ紹介する

1日1つJSのライブラリを調べます。

① ライブラリに関するドキュメントを最初から最後まで読む
② 実際に使ってみる or 使い方を調べる
③ ライブラリを3行で説明する


本日は、pusher-jsのドキュメントを読んで実際に業務で使っているところを調べました。

ドキュメント

今回読んだドキュメントはこちらです。

github.com 
pusher.com


調べたこと

pusher-jsの概要はこちらを読みました。
pusher.com

pusher-jsに登録してAPIキーをアプリケーションで読み込むようにすると、クライアントとサーバーでリアルタイム通信が行えるようになります。
この機能は、WebSocketsとHTTPを使用して実現されています。

リアルタイムな通知、ロケーション、チャット、グラフ(株とか)などで使用できるようです。
f:id:kattyan53:20200108201341p:plain
 
DATADOGもこのライブラリを使用しているようですね!

3行以内でまとめる

pusher-jsを導入すると、

  • リアルタイム通信ができるようになる。

フィードバック

  • 実はこのような Server Push の技術は歴史が古くて、方式もいろいろある(Webの技術でないものもある)。

https://ja.wikipedia.org/wiki/Push%E6%8A%80%E8%A1%93

  • RFCでも定義されているメッセージングプロトコルXMPPの初期実装が始まったのはなんと1998のこと。

https://en.wikipedia.org/wiki/XMPP

  • Webの世界ではServer Pushを行う方法として、(XHR Pollingなどを除けば)WebSocketとPush APIが代表的だと思います。(応用編)

https://developer.mozilla.org/ja/docs/Web/API/WebSockets_API
https://developer.mozilla.org/ja/docs/Web/API/Push_API

  • PusherはSaaS的なサービス。似たような技術を提供するオープンソースライブラリの Socket.IO や SockJS などは WebSocket をラップしてダメだったらXHRでの通信にフォールバックする、みたいなことをしているはず。
  • Railsの世界ではご存知 ActionCable があるが、これもWebSocketを利用したもの。
  • Chrome ConsoleではNetworkのWSタブでWebSocketの通信がデバックできる。
  • Websocketみたいな非同期通信をサービスに取り入れる場合、アプリケーションよりインフラ的な難しさのほうが大きい。
  • Websocketはコネクションを張りっぱなしにするので、接続が切れた場合の再接続とか、コネクションプールの確保とか、負荷分散のやり方とか、普通のWebサービスと同じやり方ができないことがとても多い。そこでPusherなどのSaaSを使うと、Websocketでユーザーと通信するインフラをPusherの会社がいい感じに保守してくれるので、誰でも手軽にWebsocketを使えたりする。

以上です!