JavaScriptを使わずCSSだけで構築したWebチャット

2019年5月17日 08:55

あるAnonymous Coward曰く、　JavaScriptを使わず、CSSだけでWebブラウザ上で動くチャットを実装した人が登場した（ソースコードなどを公開しているGitHubリポジトリ）。

　画面上に表示される文字ボタンをクリックして文字を入力し、「submit」をクリックするとそのテキストが送信されるという仕組み。

　CSSの「:active」セレクタでbackground-imageスタイルを指定すると、その要素がクリックされてアクティブになった際にその画像を取得するリクエストがサーバーに送信されることを文字の入力や送信に利用している。

　また、サーバーからクライアントへのメッセージ送信は、「Transfer-Encoding: chunked」ヘッダを送ってコンテンツの送信を中断状態にしておき、随時「続きのコンテンツ」を送信することで行っている。

　作者はCSSでマウスカーソルを追跡する方法に触発されたと述べている。