0Pricing
WebSockets & Realtime Systems Programming · レッスン

サブプロトコル、拡張機能、圧縮

アプリケーションのサブプロトコルをネゴシエートし、メッセージ単位の圧縮などの拡張機能を有効にして、WebSocketプロトコルをさらに深く学びます。

「サブプロトコル、拡張機能、圧縮」はCoddyKit上の無料WebSockets & Realtime Systems Programmingレッスンです。 これはレッスン4/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはWebSockets & Realtime Systems Programming学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 WebSockets & Realtime Systems Programmingコースには全4レッスンが含まれています。

このレッスンの一部はまだ翻訳されておらず、英語で表示されています。

Beyond the Basics

The raw WebSocket protocol only moves bytes. Two negotiation mechanisms let you layer meaning and efficiency on top: subprotocols and extensions.

What Is a Subprotocol

A subprotocol is an agreed application-level message format, like a contract for what the bytes mean. Examples include wamp, mqtt, and graphql-ws.

Requesting a Subprotocol

The client lists desired subprotocols in a handshake header.

Sec-WebSocket-Protocol: graphql-ws, json

Server Selection

The server picks one subprotocol it supports and echoes it back. If none match, it omits the header and only the base protocol applies.

Sec-WebSocket-Protocol: graphql-ws

Subprotocols in the Browser

Pass an array of subprotocol names as the second argument when opening the socket.

const ws = new WebSocket('wss://api.example.com', ['graphql-ws', 'json']);
console.log(ws.protocol); // the one the server chose

What Is an Extension

An extension changes how frames are transmitted at the protocol level, transparent to your application logic. The most common is per-message compression.

Negotiating Extensions

Extensions are negotiated in the handshake too, via their own header.

Sec-WebSocket-Extensions: permessage-deflate

Per-Message Deflate

permessage-deflate compresses each message with DEFLATE before sending. It cuts bandwidth for text-heavy payloads at the cost of CPU.

When Compression Helps

Compression wins for large, repetitive JSON or text. For tiny or already-compressed payloads (images, binary), it adds overhead without benefit and can be disabled.

Subprotocol vs Extension

Keep them straight:

  • Subprotocol: meaning of the messages (application layer)
  • Extension: how frames are transported (protocol layer)

Practical Notes

Both are negotiated only during the handshake and cannot change afterward. Always verify ws.protocol client-side so your code parses messages with the agreed format.

Quick Check

Test your protocol knowledge.

Recap

You explored advanced WebSocket negotiation:

  • Subprotocols agree on message format via Sec-WebSocket-Protocol
  • Extensions change frame transport via Sec-WebSocket-Extensions
  • permessage-deflate compresses text payloads
  • Both are fixed at handshake time

You now understand the negotiation layer of WebSockets.

よくある質問

「サブプロトコル、拡張機能、圧縮」レッスンは無料ですか?

はい。「サブプロトコル、拡張機能、圧縮」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し(組み込みコードエディタと24時間対応のAIチューター)、WebSockets & Realtime Systems Programmingコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 WebSockets & Realtime Systems Programmingコースには全4レッスンが含まれています。

「サブプロトコル、拡張機能、圧縮」で何を学びますか?

アプリケーションのサブプロトコルをネゴシエートし、メッセージ単位の圧縮などの拡張機能を有効にして、WebSocketプロトコルをさらに深く学びます。 ブラウザで直接実行するハンズオンコードでWebSockets & Realtime Systems Programmingを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。

WebSockets & Realtime Systems Programmingを始めるのに経験は必要ですか?

事前経験は必要ありません。CoddyKitのWebSockets & Realtime Systems Programmingは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン4/4です。

「サブプロトコル、拡張機能、圧縮」レッスンにはどのくらい時間がかかりますか?

ほとんどのCoddyKitレッスンは約5~10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。

このWebSockets & Realtime Systems Programmingレッスンでコードを書いて実行できますか?

はい。すべてのWebSockets & Realtime Systems Programmingレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。

このコースのすべてのレッスン

  1. WebSocketハンドシェイクの仕組み
  2. WebSocketのデータフレーミングとメッセージ
  3. 接続のライフサイクルと状態
  4. サブプロトコル、拡張機能、圧縮
← WebSockets & Realtime Systems Programmingに戻る