ネットワークにおいて「コネクション」という単語はよく耳にします。
- 「WebSocketはコネクションを確立後、ずっとそのコネクションを使う」
- 「ロングポーリングは返すたびにクライアントがコネクションを確立し直す」
- 「TCPでは3ウェイハンドシェイクでコネクションを確立する」
これらを見ると「コネクションは通信経路のことなのかな?」と勘違いしそうになります。実際僕はそう勘違いしていました。今回はそんな実態のよくわからない「コネクション」について解説します。
続きを読むネットワークにおいて「コネクション」という単語はよく耳にします。
これらを見ると「コネクションは通信経路のことなのかな?」と勘違いしそうになります。実際僕はそう勘違いしていました。今回はそんな実態のよくわからない「コネクション」について解説します。
続きを読むES2019でArray#flatMapが導入されたので、それを使ってどんな深さの配列でも1次元にする方法を紹介します。
flatMapはmap()してからflat()するメソッドです。
[1,2,3].map(n => [n,-n]); // [[1,-1],[2,-2],[3,-3]] [[1,-1],[2,-2],[3,-3]].flat(); // [1,-1,2,-2,3,-3] [1,2,3].flatMap(n => [n,-n]); // [1,-1,2,-2,3,-3]
flatMapを使って、どんな深さの配列でも1次元に落とし込みます。これは「無限回flat()を行い、1次元になった時点でやめる」のと等価なので、flatInfと名付けました。
const arr = [1, [2, [3, 4, [5]]]]; const flatInf = item => { if (Array.isArray(item)) return item.flatMap(flatInf); return item; }; console.log(flatInf(arr)); // [1, 2, 3, 4, 5]
これだけです。配列の要素が1次元の配列か要素のみなら、flat()するだけで1次元になります。
// 1次元の配列か要素のみの配列 [[1, 2], 3, [4, 5, 6], 7, 8, 9].flat(); // [1, 2, 3, 4, 5, 6, 7, 8, 9]
与えられる配列の各要素の深さは1次元とは限りません。コレを1次元にするために、再帰的にflatInfを適用しています。
そこまで変わりませんが。
const arr = [1, [2, [3, 4, [5]]]]; const flatInf=a=>Array.isArray(a)?a.flatMap(flatInf):a; console.log(flatInf(arr)); // [1, 2, 3, 4, 5]
最近ネットワーク周りについて興味があって調べているので、その結果をまとめました。
HTTPのこれまでの課題、HTTP/3 over QUICや5Gといった今後の技術についてわかりやすくまとまったスライドです。
HTTP/2の特徴 HTTP/1.1との違いについて | REDBOX Labo
HTTP/1.1からHTTP/2はどのように変わったのかまとめられています。
GoogleのQUICプロトコル:TCPからUDPへWebを移行する | POSTD
「TCPでのコネクション確立、TLSのネゴシエーションというコストがかかる通信をQUICが置き換えるよ」という話です。
Head of Line Blocking - High Performance Web 2015 - Qiita
HTTP/1.1で起きるHoLブロッキングと、HTTP/2で起きるHoLブロッキングそれぞれの解説と、QUICならどちらも解消できるという話です。
QUICとHTTP/3時代のインターネット解説書はどうあるべきだろう - golden-luckyの日記
QUICについてのよくある誤解や、QUICがOSI参照モデルに当てはまらないよというような話です。一言で要約することが困難なので一読をおすすめします。
これらは「ブラウザ上でのリアルタイム通信」に関する話題です。リアルタイム通信はチャットやオンラインゲーム、通知などで必要になる技術です。また、ツイッターのタイムラインなどでも利用されます。
リアルタイムなwebアプリを実現する方法(ポーリング、Comet、Server Sent Events、WebSocket) - Qiita
リアルタイム通信の種類についての記事です。
4つのリアルタイム通信方式の違いについて図でわかりやすく解説されています。
WebRTCはサーバーを介さないでクライアント同士が通信を行う(P2P通信する)ための技術です。リアルタイム通信という側面も持ち合わせています。
WebRTCの基本とP2P通信が成立するまでを学ぶ - Qiita
WebRTCで通信ができるまでのプロセスについての記事です。WebSocketも出てきます。
APIを扱いたいとき、今まではRESTが多かったです。しかし、GraphQL、gRPCといった選択肢が出てきました。
GraphQLを最速でマスターするための意識改革3ヶ条 - Qiita
GraphQLとRESTの違いや、「GraphQLは操作とデータ取得のみに専念して、認証などは別の層で捌くべし」という記事です。
gRPCについての記事です。正直僕はこの記事だけでは理解できませんでした。gRPCはフロントエンドとバックエンドの通信はできず、バックエンド間の通信を担うらしい(??)(gRPC-Webなるものはできるそうですが)。
Edgeサーバーとは、クラウドとクライアントの間に置かれるサーバーです。同名のブラウザとは関係ありません。
Edgeサーバーは主にクライアントとクラウド間での通信コストを下げる目的で使用されます。ユーザーに地理的に近い位置にサーバーを配置して、高速で通信できるようにして、Edgeサーバーでできることはしてしまおうというモノです。IoTや自動運転関連でよく出てきます。
リーダブルコードを読む前に書いたコードを見たら、ゴミすぎて全部書き直しました。
今回はこちらのコードを書き直しました。
ひらがなからローマ字への変換可能パターンを列挙するプログラムをつくった - Panda Noir
続きを読むz-indexを「なんとなく」で扱っていませんか?その結果
といったことになったこと、ありませんか?z-indexという"""災厄"""とうまく付き合いたくありませんか?
z-indexを使っていて混乱するのは「グローバルに」扱ってしまっているからです。グローバル変数が悪というのは古から言われています。z-indexもグローバルに扱うことはもちろん握手です。
z-indexを「ローカルに」領域を区切って扱えると良いと思いませんか?実はできるんです!
続きを読む