at #ワインと鍋js なぜフロントエンドに Edge Worker が必要なのか、Cloudflare Workers をどう使っていくかみたいな話をしました
![Edge Side Frontend という新領域](https://cdn-ak-scissors.b.st-hatena.com/image/square/fba233c2d8d4e1c3927e7985ced012786fbe22dd/height=288;version=1;width=512/https%3A%2F%2Ffiles.speakerdeck.com%2Fpresentations%2F903e170d2d8d4f878dfcf5a6390d63be%2Fslide_0.jpg%3F22137912)
at #ワインと鍋js なぜフロントエンドに Edge Worker が必要なのか、Cloudflare Workers をどう使っていくかみたいな話をしました
いわくら君が書いてくれた通り 、トラベルブックではFastlyを導入しました。Fastlyについて初めて分かったことがたくさんありました。列挙してみたら30個もあったので、一個ずつ紹介してみることにします。 そもそもFastlyとは そもそもFastlyとはCDNのサービスです。現在では後述するCompute@Edgeを主力としたサーバーレス環境を推していますが、とにかくCDNです。今回は www.travelbook.co.jp ドメイン全てに対して適応し、全てのHTMLページをFastly経由にしました。 もともとVarnishでページをキャッシュしていた部分をFastlyに置き換えることで冗長化・安定化、また、パフォーマンスアップを図ります。 加えて、これまでキャッシュの対象外だったページも、この際TTL付きでキャッシュする、というのが今回やったことです。 詳しくはいわくら君の書いた
BOXILでエンジニアをやっている永井です。前回は入社エントリを書きましたが今回は技術的な記事を書こうと思います。 今回はCloudflareにおける画像の最適化処理のコストカットをした話をします。ざっくりいうとCloudflare内のKVという機能を使い、最適化をした画像をキャッシュしました。似たような問題で悩んでいる方は参考にしてもらえると嬉しいです。 TL;DR Cloudflareで画像のリサイズ(形式変更)を行っていた リサイズ後の画像はデフォルトではキャッシュされず、都度リサイズの処理が実行されていた Cloudflare内のWorker KV機能を使いキャッシュの実装をしたところ、コストがおよそ97%削減できた TL;DR 前提 問題 対策 Workers KVとは 注意事項とか サンプル 事前準備 KVのnamespace作成 KVをworkerに登録 流れ Keyについて
先日の Next.js Conf で Vercel は Next.js の新しいバージョン「12」をリリースした。 興味深いのは、Vercel は同時にEdge Functionsというサービスを開始したことだ。 Edge Functions – Vercel 謳い文句のひとつに Push your functions to the edge とあるように、「エッジ」で実行される「関数」を提供するプラットフォームである。 ここで言うエッジとはなにかというと、Vercel は明言していないが CDN のエッジのことだ。 Vercel の例のように「CDN のエッジで実行する系」が増えている。例えば以下の 7 つだ。 Cloudflare Workers Fastly Compute@Edge AWS CloudFront Functions AWS Lambda@Edge Deno Depl
最近は Cloudflare Workers が熱くて、週末はずっとその調査しています。この記事はそのまとめです。 注意点として、手元でいろいろなパターンで動かして試してはいますが、プロダクション環境で運用したわけではないです。それを踏まえた上でお読みください。 特に断りが無い限り、引用文は DeepL で翻訳したものです。 Cloudflare Workers とはなにか Cloudflare Workers | サーバーレスコンピューティング | Cloudflare 一言でいうなら 「ServiceWorker の API が CDN Edge 上で動く JavaScript 処理系」 です。 Technology Radar では、まだ ASSESS(調査) フェーズという扱いです。 Cloudflare Workers | Technology Radar | ThoughtWo
「CDN」(content delivery network)という言葉からは、Googleのような大企業がいくつもの巨大なハードウェアを管理し、1秒当たり何百ギガビットものデータを処理する様子が想像されます。しかし、CDNは単なるWebアプリケーションです。私たちのイメージとは違いますが、それが事実です。8年前に買ったノートパソコンを使って、コーヒーショップの席に座りながらでも、きちんと機能するCDNを構築できます。この記事では、これから5時間でCDNを開発しようとするときに、直面するかもしれないことを紹介します。 まずはCDNの機能を明らかにしておきましょう。CDNはセントラルリポジトリ(通称:オリジン)からファイルを吸い上げ、ユーザーに近い場所でコピーを保存します。初期のオリジンはCDNのFTPサーバーでした。現在、オリジンは単なるWebアプリとなり、CDNはプロキシサーバーとして機
今回は、何故CDNを使う必要があるのか、CDN の 仕組み や技術的なことをなるべく分かりやすく解説したいと思います。 WEB高速化、負荷分散、オンデマンド・ライブ動画配信、コンテンツ配信、ということを検討もしくはこれから始めようとしている方は、CDNというキーワードを一度ぐらいは聞いたことがあると思います。CDNってどんな仕組みでどのようなことが出来るかご存じですか? まずはCDNの簡単な歴史から。 CDNの歴史CDN(コンテンツデリバリーネットワーク)というのは、大手Akamaiさんが1990年代に提唱したといわれているコンテンツを配信するためのネットワークのことです。実は、最近できた技術や仕組みではありません。 インターネットが流行りだした時代からありました。 しかし、近年では90年代当初から比べると様々な仕組みや技術が取り入れられた次世代CDNに進化しています。 CDNとは?CDN
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く