Next.jsのISRで動的コンテンツをキャッシュするときの戦略
最近Next.jsのISR（Incremental Static Regeneration）を耳にする機会が増えてきました。Zennでも2021/3/17時点で記事や本などの一部のページでISRを採用しています。 ISRとは何か ISRを使うことで、動的なコンテンツを含むページも静的ページとしてCDNにキャッシュすることが可能になります。Next.jsのISRはドキュメントに書かれているようにstale-while-revalidateという考え方でキャッシュが行われます。 具体的には、リクエスト時にページのキャッシュを作成し、次のアクセスではキャッシュされた古いデータを返します。その裏で次のアクセスに向けてキャッシュが再生成されるというイメージです。 これによりユーザー投稿コンテンツであってもCDNにキャッシュしやすくなるというわけです。 Next.jsでのISRの実装 デプロイ先がVe
Cypress + CircleCIの高速化Tips - notebook
簡単なテストケースをいくつか書いただけで5分以上掛かるようになってしまったのでチューニングの機運！ ということで今回はキャッシュについて バイナリのキャッシュ Cypressはバイナリのインストールをnode_modulesではないところにインストールしています Installing Cypress | Cypress Documentation docs.cypress.io CircleCIでCIを回すときに使っているイメージはLinuxなので~/.cache/Cypressにインストールされるが毎度インストールが走ります その結果毎度npm installに1分以上もかかるということになってしまいます ここはCircleCIのcacheを使えば楽勝じゃん！という感じなのですがそう簡単ではありませんでした 単純に - save_cache: key: sample-key-{{ .Br
はてなブログのキャッシュ周りをきちんと改善したら、アプリケーションサーバの台数を半分にできた話 - Hatena Developer Blog
はてなブログでSREをやっているid:cohalzです。 2019年12月頃からid:utgwkkやid:onkとともに、はてなブログにおけるキャッシュ周りの改善を行いました。その結果、次のような成果が得られました。 ブログ記事のキャッシュヒット率が、1日平均で8％から58％に向上 アプリケーションサーバの台数を、以前の半数以下に削減 DBに届くリクエスト数が、以前の3分の2まで減少 レスポンスタイムの平均が、以前の8割まで減少 この記事では、実際にどういった改善を行ったのか、その際に気をつけたことや大変だったことを紹介します。 はてなブログがVarnishを導入した経緯と課題 開発合宿をきっかけに問題が明らかになる 進め方をまず考える ホストのメモリをできるだけたくさん利用する メモリを積んだホストでなぜかレイテンシが悪化 キャッシュが分散しないようVaryヘッダを使う デバイス情報を適
GraphQLとPersisted Query - Qiita
最近、GraphQL APIをインターネット上に晒す上で何を考慮したらいいのだろうか、的なことを考える機会が多く、空いた時間でチマチマと素振りしています。 今日はGraphQLのクライアント - サーバー間に挟むリバプロ的な機能について書いてみようと思います。 やりたいこと 1. 想定しないクエリの排除 例えばECやメディアサイトのような、未ログインでも情報の閲覧が可能なサービスのWeb API層をGrahpQLで実装したとします。ECにしろメディアにしろ、詳細ページでの回遊率を上げるため、詳細同士を関連付けるようなスキーマ設計となるのは自然なことでしょう。 GrahpQLのスキーマ定義で書くと、下記のようなイメージです。 type Product { id: ID! name: String! relatedProducts: [Product] } type Query { produ
CDN Study (Akamai/Fastly) に行ってきたメモ #CDN_study - console.lealog();
CDN Study (Akamai/Fastly) - connpass 久しぶりにすごい人混みに身をおいたわ・・。 どんな勉強会だったか CDNにもいろんな歴史がある あの頃のCDNといまのCDNでは、世界観も役割も変わってきてる 気がする ので、中の人に聞いてみよう！ という主旨の会。 from Akamai 資料は見つけたら CDNの過去と現在 1995年の時点で、中央集権的なWebは破綻するといわれていた 中央集権型ゆえに インターネットの混雑が問題になるだろう from Tim Berners-Lee インターネットは網の目 ただ実際は地震でケーブルが切れて不安定になったり 去年のGoogleの経路のアレとかも 爆発的なトラフィックによる負荷 スターウォーズの新作トレーラーとか インドのプレミアリーグとか CDNってそもそも インターネットの不安定さを避けるためにどうすれば ユー
Varnish入門と仕組み - Qiita
Varnish入門と仕組み Agenda Varnishとは 仕組み 入門 ベンチマーク Reference Varnishとは 2005年に作成 ライセンス BSD cache機能を持つリバースプロキシとして知られるOSSのHTTPアクセラレータの一つ(Squid cache等) プロキシについて フォワードプロキシ Clientの前段に配置して不特定多数のサイトに代理でアクセスしにいくこと リバースプロキシ Serverの前段に配置して不特定多数のクライアントからアクセスしてきたのを代理レスポンス返す WHY プロキシ? 負荷分散 セキュリティ向上 コンテンツキャッシュによる応答の高速化 どこで使われてる? Fastly Cookpad Hatena 大規模サービス技術入門より 某アイドルの投票 過負荷に耐えるWebの作り方より Varnishのキャッシュについて Varnishはキャ
CDNに動的コンテンツを安全に通すにはどうするべきか - 方向
メルカリでCDNにキャッシュされるべきでないページがキャッシュされることにより個人情報の流出が発生してしまうインシデントがありました 自分は動的コンテンツをCDNで配信することにあまり積極的ではない立場だったのですが流出への反応を見るとCDNを利用しているサービスはかなり増えてきているようです 個人情報やユーザーのプライベートデータを決して流出しないようにしつつCDNを利用する方法を考えてみました CDN利用のメリット このふたつ 経路が最適化されレイテンシが小さくなる DDoS対策となる キャッシュされないようにする方法 Twitterで動的コンテンツもCDN通すの当たり前でしょーと言ってる人にリプしてきいてみました CDNとレスポンスヘッダで二重にキャッシュを無効化する キャッシュを細かくコントロールCDNを使う ホワイトリスト方式で特定のパスのみキャッシュを許可 ログインセッションを
キャッシュについて整理 - Qiita
キャッシュとは 使用頻度の高いデータを高速な記憶装置に蓄えておくことにより、いちいち低速な装置から読み出す無駄を省いて高速化すること。また、その際に使われる高速な記憶装置や、複製されたデータそのもののこと。 - IT用語辞典 Webサイトの表示においては、一度アクセスしたページのデータを特定の場所に保存することで、次回アクセス時の表示を速くし、サーバへの無駄なリクエストを減らせるというメリットがあります。また一口にキャッシュといっても下記の2種類があるので、どちらを指しているのか（あるいは両方か）意識しておきましょう。 ブラウザのキャッシュ：そのパソコンのユーザーが見たページのデータがローカルに溜まっていく。 キャッシュサーバのキャッシュ：不特定多数のユーザーが見たページのデータがネットワーク上に溜まっていく。 キャッシュの制御方法 ✏️ HTTPレスポンスヘッダ で制御 ➡️ Cache
WordPressキャッシュ系プラグインの比較とサイトに適した選び方 | ゆっくりと…
WordPress の運営を始めて1年後にしてようやく（満を持して！）、キャッシュ・プラグインを使い始めています。とは言っても、最初は 「アレが速い」 とか 「コレが良い」 などといった記事に目移りして、何をどう使えばよく分かりませんでしたが、ここらで私が理解出来ていることをまとめてみたいと思います。 下図は、サイト閲覧者 ～ WordPress 間の主要なキャッシュ機構とそれをサポートするプラグインの関連です。サーバーのファイルシステムや、メモリ／ハードディスクなどの I/O レベルのキャッシュなどは割愛します。 図を見れば分かる通り、W3 Total Cache がその名の通り全てのキャッシュをカバーしています。さらにメモリ・キャッシュ、CDN へのアップロード機能、各種 PHP アクセラレータ （ACP、eAccelerator、XCache）、HTTP アクセラレータ （Varni
高速なWebサーバアプリケーションを構築するための6つの経験則 | POSTD
この記事では、Webアプリケーション（特にバックエンド部分）を構築するときにハイレベルなパフォーマンスを達成しようとするなら考慮するべき、最も一般的な原則のいくつかを取り上げたいと思います。私は、自分自身の経験から、主にPHPの世界で使われるいくつかの例、設計パターン、慣例やツールについて書きますが、ここで説明する概念は、どんな言語やフレームワークにも必ず当てはまると思います。 手短に言うと、基本ルールは次の6つです。 ルール1 . 時期尚早な最適化を回避する ルール2 . 最小限の作業で問題を解決する ルール3 . 今すぐやらなくてもいい作業は延期する ルール4 . 使えるときはキャッシュを使う ルール5 . リレーショナルデータベースのN+1問題を理解し、回避する ルール6 . 可能ならアプリケーションに水平スケーラビリティをもたせる ルール1: 時期尚早な最適化を回避する Donal
HTML5のlocalStorageでiPhone用Webアプリを高速化
HTML5のlocalStorageでiPhone用Webアプリを高速化：iPhoneで動かす業務用Webアプリ開発入門（4）（1/2 ページ） 今回は、iOSのSafariの中にデータを記録できる、HTML5の「localStorage」機能を使って、データの先読みとキャッシュを実現しアプリケーションの体感パフォーマンスを向上させてみます。 HTML5の「localStorage」とは localStorage（ローカルストレージ）とは、HTML5で規定されている、Webブラウザ内部のKVS（キーバリュー型データストア）です。iOSのSafariでも実装されていて、JavaScriptコードからアクセスでき、任意のデータを保存できます。 いきなり注意！ localStorageの保存データはテキストで！ HTML5の仕様では、localStorageに保存できるデータはJavaScrip
今すぐ使える！CDN ~はじめてのCloudFlare（クラウドフレア）導入~ | ブログ | SINAP - 株式会社シナップ
シナップの柿内です。 最近、CloudFlareという無料で簡単に使えるCDNサービスが話題を呼んでいます。 CDN（コンテンツ・デリバリー・ネットワーク）とはコンテンツを複数地域の複数サーバーに配置し、ユーザーのリクエストに対して最適なサーバーからコンテンツを配布する負荷分散サービスです。よくオープンソースをダウンロードする時に一番近いミラーサーバーを選択してダウンロードしますが、それをユーザーの操作なしに全部自動で行ってくれると考えれば想像しやすいのではないでしょうか。 本来CDNは大規模なリクエストを円滑に処理するように生まれたサービスなので、小規模なWebサイトで導入する事はあまりありませんでした。それがCloudFlareならば誰でも（後で解説するように利用するためには簡単な条件をクリアする必要がありますが）今日にでも利用する事が可能です。しかも無料で。 同じCDNサービスである
2008-12-26
config/core.php Configure::write('Cache.disable', false); Configure::write('Cache.check', true); contollers/*_controller.php var $helpers = array('Cache'); var $cacheAction = 86400; アクションごとにキャッシュを無効にすることも可能です。 controllers/*_controller.php var $cacheAction = true; function index() { $this->cacheAction = false; } indexはキャッシュされません。 cakephpのcacheの設定がよくわからないので、メモします。 Cache.disable trueに設定すると、サイト全体のキャッシ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IBM Developer
https://www.matsuaz.com/matsumotojs/2011/11/29/1322493393285.html