Node.js Stream の初歩 - 30歳からのプログラミング
Node.js には Stream というインターフェイスが用意されており、これを使うことでデータをストリーミングできる。 Stream を使うことで、データの全てをメモリに保持するのではなく、少しずつ順番にデータを処理していくことが可能になる。 この記事では、Stream の基本的な使い方について説明していく。 WHATWG で定義している Stream はまた別の概念なので、注意する。この記事で扱っている Stream は、それとは別に以前から Node.js に実装されている Stream である。 以下の環境で動作確認している。 Node.js のバージョン 16.15.1 使っている npm ライブラリ @types/node@16.11.43 ts-node-dev@2.0.0 typescript@4.7.4 環境構築 まず最初に、手元で実際にコードを動かすための環境を構築す
動的コンテンツのキャッシュを最適化するプッシュ型アーキテクチャ - 30歳からのプログラミング
エッジサーバからのレスポンスは速い。 コンテンツを CDN のエッジサーバにキャッシュしてそれを返すようにするだけで、ウェブサイトの速度は目に見えて改善される。 特に、リクエストの度にサーバで動的に生成されるコンテンツの場合、キャッシュを利用することで大きな恩恵を受けられる。パフォーマンスが改善されるだけでなく、オリジンサーバの負荷軽減にもつながる。 しかしコンテンツを動的に生成するということは、リクエストの度に生成されるコンテンツが変わる可能性があるということであり、キャッシュを利用するのが難しい。全てのリクエストに対して同じコンテンツが生成されるのであれば、わざわざリクエストの度に生成する必要はないからだ。事前にコンテンツを用意しておいてそれを返せばよい。ビルド時にコンテンツを生成する SSG（Static Site Generation）などがその一例。 リクエストの度にコンテンツが
有効期限切れのキャッシュをそのまま再利用させないための must-revalidate ディレクティブ - 30歳からのプログラミング
レスポンスヘッダのCache-Controlフィールドに設定できるディレクティブとして、must-revalidateがある。 これは、有効期限が切れたキャッシュをそのまま再利用することを許可せず、必ずオリジンサーバに問い合わせることを指示するディレクティブである。 逆に言うと、must-revalidateがない場合、既に有効期限が切れているキャッシュが再検証なしに使われてしまう可能性がある。 この記事では、must-revalidateの有無で動作がどのように変わるのか、CDN として Cloudflare を利用した構成を使って確認していく。 API の返り値をキャッシュしたいので、「キャッシュ レベル」を「Cache Everything」にしている。 また、クライアントのキャッシュが再利用されないように、シークレットウィンドウを使って動作確認している。 結論を先に書くと、must
Route 53 + Cloudflare + Heroku で Deno アプリを公開する - 30歳からのプログラミング
先日、砂場として使うために以下の構成のウェブアプリを作った。 Deno で作ったアプリケーションサーバを Heroku で公開し、それを Cloudflare 経由で配信する ドメインは Route 53 で取得したものを使う Heroku も Cloudflare も無料プランを利用する 忘れないうちにその手順を記録しておく。 ちなみにこの構成だと、ドメイン代以外の費用はかからない。 HTTPS で配信される独自ドメインのサイトを、無料で公開できる。また、クライアントとエッジサーバ間は HTTP/3 で配信できる。 Deno のバージョンはv1.10.3を使っている。 必要なファイルの用意 まずは Deno でアプリケーションサーバを作る。 以下の内容のserver.tsを作る。 import { listenAndServe, ServerRequest, } from "https:
Deno で 学ぶ React のサーバサイドレンダリング - 30歳からのプログラミング
Deno で React のサーバサイドレンダリング（以下、SSR）を実現する方法をハンズオン形式で書いていく。 自分が調べた範囲では、単に JSX で HTML を構築して終わり、という記事が多かった。それではあまり実用的ではないので、この記事ではハイドレーションまで行う。 また、React で SSR する方法を調べたところ、ほとんどの記事が Next.js を前提としていた。確かに Next.js を使わずに SSR するケースはあまりないだろうし、記事としても需要がないのだと思う。 しかし、Next.js のようなフレームワークが裏側で何をやってくれているのかを知ることで、SSR に対する理解を深めることができる。 事実、私は SSR をほとんど使ったことがなかったが、この記事を書くことでかなり考えを整理することができた。 Deno のバージョンは1.11.2で動作確認している。
Cloudflare Workers KV の初歩 - 30歳からのプログラミング
Cloudflare Workers KV は、Cloudflare のエッジサーバからアクセスできる、グローバルなキーバリューストア。 Workers スクリプトからアクセスして使う。 各エッジサーバ毎に存在するのではなく全てのエッジサーバが共有するストアであるため、API など様々な用途で使える。 そしてエッジサーバで動くため、レイテンシが小さくなるというメリットもある。 この記事では、既に Cloudflare Workers を利用しているサイトに Workers KV を導入する手順を見ていく。 まず、名前空間を作成し、それを Workers と紐付ける必要がある。 名前空間の作成は Cloudflare のダッシュボードからもできるが、ここでは CLI ツールの wrangler を使う方法を紹介する。 Workers スクリプトのディレクトリで、以下のコマンドを実行する。wr
Cloudflare Workers KV をキャッシュとして使う - 30歳からのプログラミング
Cloudflare Workers KV を使うと、ストアに保存した値を HTTP レスポンスとして使うことができる。 そのため、オリジンサーバに問い合わせて得られた結果をストアに保存しておくことで、キャッシュのように使うことができる。 この記事では、Workers KV をキャッシュとして使う Workers スクリプトのサンプルを書いていく。 Workers KV のセットアップについては以下を参照。 numb86-tech.hatenablog.com 処理の大まかな流れ 今回は、以下の仕様の Workers スクリプトを作ることにする。 対象の URL は/js/foo.jsと/js/bar.js 対象の URL にアクセスがあった場合、KV にデータが格納されていないか確認する 格納されていた場合はそれをクライアントに返す 格納されていなかった場合はオリジンサーバに問い合わせ、
Cloudflare CDN での Cookie の取り扱いと注意点 - 30歳からのプログラミング
CDN のエッジサーバにキャッシュされたコンテンツは、最初にアクセスしたクライアント以外にも利用される。 例えば、キャッシュが存在しない状態で A というクライアントがhttps://example.com/someにアクセスした場合、オリジンサーバがコンテンツを返す。その際、エッジサーバがそのコンテンツをキャッシュしたとする。そうすると、次に A がこの URL にアクセスした場合はもちろん、A 以外がこのエッジサーバ経由でアクセスした場合も、オリジンサーバへの問い合わせは行われず、エッジサーバがキャッシュを返すようになる。 そのため、レスポンスの高速化や、オリジンサーバの負荷軽減が見込める。 だがそれは、エッジサーバにキャッシュしたコンテンツは不特定多数のクライアントに閲覧される可能性がある、ということを意味する。 アクセス制限がないコンテンツならそれで構わないのだが、アクセス制限のあ
入社からの半年間でコードレビューで指摘されたことのまとめ - 30歳からのプログラミング
実務未経験でプログラマとして入社して半年以上が経った。 コードレビューで指摘されたことを備忘録としてまとめておく。 自分なりにまとめたものなので、レビュアーが言いたかったこととニュアンスや解釈がずれている可能性はある。 初歩的な内容ばかりで我ながらうんざりする。 せっかく優秀な同僚ばかりなのだからもっと高度なことを学びたいが、こういう初歩的なことが出来ないのが俺の現状なのだから、仕方ない。 そもそもPullRequestを送ったこともなかったわけだし。入社初日は、一人でPullRequestの出し方を練習していた。 それを考えればまあ、こんなものだろうか。 当たり前のことをちゃんと当たり前に出来るようになって、早く、次のステージに進みたい。 PullRequest(PR) PRのタイトルは分かりやすいものに。必要に応じてチケットの番号なども入れる。 コミットやPRは出来るだけ粒度を細かくす
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
