Next.js の "use cache" ディレクティブによるキャッシュ制御 Next.js の App Router はデフォルトでキャッシュされる設計でリリースされました。一方でデフォルトでキャッシュされることに対して不満を持つ開発者も多かったように思います。このようなフィードバックを受けて、Next.js 15 ではいくつかのキャッシュ戦略が変更されました。さらに現在 canary チャンネルで提供されている dynamicIO フラグを有効にすることで、"use cache" ディレクティブを用いてキャッシュを制御できるようになります。 Next.js の App Router では最もパフォーマンスの高いオプションで提供されるために、デフォルトでキャッシュが有効になっており、必要に応じてオプトアウトする設計でリリースされました。例えば global fetch 関数に patc
App Router でトラディショナルな動的 SSR 既存〜今後のコンポーネントの互換性を踏まえて React を前提とし、フレームワークの分散を抑制するため Next.js を選び、多少の冒険ではあったが App Router での開発にトライしています。 今後は現在 Ruby on Rails のモノリシックコードベースで展開されている複数プロダクトを分割し、それぞれを Next.js で水平展開し直していくイメージです。 で、まずは App Router のフルパワー（サバクラに渡る重厚なキャッシュ機構）を要しない、ログインする操作こそあれだページの9割9分が Server Components としてレンダリング可能な領域をリプレース中。 つまり // app/layout.js export const fetchCache = 'default-no-store'; expo
Next.jsを初心者向けツールとして捉えている自分が、実践 Next.js を読んでみて2024-03-28 この記事は 実践 Next.js の書評です。 見本誌を頂いた上での記事です。（PR記事？） tl;dr App Router のメリットを理解しつつも、学習コストに割り合わないと思っている人にオススメ！ドキュメントを読めるようになるし、学習コストが下がる。 はじめに 自分はどちらかというと今の Next.js に対しては否定的な感情の割合の方が高く、仕事で困らない程度の最低限の知識しか持っていない。 しかし、なんだかんだ勉強の必要性に駆られていて、そのキャッチアップとして同書の発売を楽しみにしていた。 そんな折に @takepepe さんから見本誌をいただいたことで、この週末に読んだので書評を書きたい。 俺は今のNext.jsが好きではない 書評を書く前にポエム書かせてくれ！
Next.js セカンドインプレッション - koudenpaのブログで、書いた通りNext.jsとはしっかり付き合いはじめて日が浅いのだけれど、横目で眺めていた時期と主体的に触って感じたことからどういう構成をとるのかの考えが固まってきたので書いておく。 暫くたって見直して「とんちんかんなことを考えていたな」となるのも一興。 なお、「こんな感じで行こう」の対象は本業ではなくプライベートです。 考え方 目的 ポリシー 構成 ポリシー 最新情報を表示する需要への対応 想定AWS構成 感想 考え方 目的 ユーザーの体感速度向上 システムへの負荷低減≒ホスティングコスト低減 JavaScriptを処理しないクローラへのコンテンツ提供 この辺は当たり前のことではあるけれど、目的を見失わないように何を考えてキャッシュするのかは考えておきたい。 ポリシー キャッシュはシンプルに構成する Amazonのよ
Next.js には強力な Incremental Static Regeneration がありますが、Vercel 以外にホストしている場合は使うことができません。そのとき、Cache-Control や Surrogate-Control ヘッダを用いて Fastly のような CDN にキャッシュを持たせたくなります。 このヘッダの持たせ方に少しクセがあったので備忘録的に書きます。 例えば、/articles/[id] にヘッダを持たせたいとします。 方法1. next.config.js で設定 next.config.js の headers で設定する方法です。 const cacheHeaders = [ { key: 'Cache-Control', value: 'max-age=0', }, { key: 'Surrogate-Control', value: 'pu
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
