diff --git a/raw-data/AD TERM.md b/raw-data/AD TERM.md index 9a9684b..e0d60c2 100644 --- a/raw-data/AD TERM.md +++ b/raw-data/AD TERM.md @@ -8,5 +8,13 @@ ad ## description +- DSP + - アドネットワークで集約されたデータを活用し、効果の高い広告配信を実現する + - 媒体での設定項目が年齢、性別、興味関心などになるため、特定ユーザーをターゲットにできる +- アドネットワーク + - アドネットワーク媒体に広告を入稿すると、媒体を通じて複数のアプリやサイトに広告を配信する仕組み + - アドネットワーク媒体がなかった時代は、アプリやサイト 1 つ 1 つに入稿する広告の設定を行っていたため、運用工数が肥大化していた + - 代表的なアドネットワーク + - GDN、YDA、Meta 広告 Audience Network、LINE 広告ネットワークなど - コストシェア - コスト全体のうち、そのクリエイティブが占めるコストの割合 diff --git a/raw-data/NEXT.JS.md b/raw-data/NEXT.JS.md index dee6cf2..671f6ba 100644 --- a/raw-data/NEXT.JS.md +++ b/raw-data/NEXT.JS.md @@ -24,3 +24,27 @@ Server Actions はサーバーコンポーネントとクライアントコン クライアントコンポーネント内では、Server Actions は定義できないが、別ファイルに定義した Server Actions を import することはできる import した Server Actions はフォームアクション（`
`）などを利用して、ユーザーのインタラクションに応じて実行することが可能 + +### Cache + +Next.js には 4 種類のキャッシュがある + +- Request Memoization（サーバー機能） + - React は fetchAPI を拡張し、同じ URL とオプションを持つリクエストを自動的にメモ化する + - 同じリクエストの重複は排除される + - そのリクエストが生きている間のみ有効 + - リクエストのメモ化は React の機能であり、Next.js の機能ではない +- Data Cache（サーバー機能） + - Next.js は fetchAPI を拡張し、各リクエスト独自のキャッシュを保持できる + - メモリが生きている間のみ有効 + - リクエストのキャッシュ化は、Next.js の機能 +- Full Route Cache（サーバー機能） + - Next.js はビルド時にルートを自動的にレンダリングし、キャッシュする + - これにより、サーバー上で毎回レンダリングする代わりにキャッシュされたルートを返すため、ページの読み込みが高速化される + - デフォルトで永続的なキャッシュのため、キャッシュの無効化はデータの再検証や再デプロイによって行える +- Router Cache（クライアント機能） + - Next.js は RSC Payload（RSC のレンダリング結果と RSC からクライアントへの Props）を個別のルートごとにキャッシュする + - ユーザーがルート間を移動する際、訪れたルートセグメントをキャッシュし、ユーザーが移動する可能性があるルートを事前に fetch する + - ユーザーのナビゲーション体験が向上する + - キャッシュの持続期間はセッションによって決まり、セッションはナビゲーション間は維持されるが、ページのリフレッシュで破棄される + - 時間ベースでのキャッシュ無効化も可能 diff --git a/raw-data/REACT.md b/raw-data/REACT.md index 3de7fbf..cf20906 100644 --- a/raw-data/REACT.md +++ b/raw-data/REACT.md @@ -365,7 +365,7 @@ export const Button = ({ onClick }: Props): JSX.Element => {} ### Data fetch 観点での useEffect と Suspense について -useEffect に渡された関数は画面レンダリング後に実行される +useEffect に渡された関数は画面レンダリング後に実行される（Fetch-on-render パターン） たとえば Data fetch を渡すと画面レンダリング後に実行されることになる （画面レンダリング前に関数を実行することができる useLayoutEffect という Hook はある） @@ -376,6 +376,10 @@ Suspense は Promise（Data fetch など）が解決されるまでは fallback ただし、これは useEffect を使って Data fetch を行う場合のみであり、useEffect と Suspense が共存できないということではない React.lazy などの非同期コンポーネントをロードする際には、Suspense と useEffect が共存して問題なく機能する +waterfall 問題 +親子関係のコンポーネントが両方 Data fetch を行っている場合、親の Data fetch 完了後に子の Data fetch が行われるため、処理が直列になってしまう（waterfall 問題） +⇒ 本来並列に処理できるものが直列になってしまう + ### 良い設計方針 - components