diff --git a/advanced/subpath/route53-cloudfront.mdx b/advanced/subpath/route53-cloudfront.mdx index ed35c3718..9b2e7d774 100644 --- a/advanced/subpath/route53-cloudfront.mdx +++ b/advanced/subpath/route53-cloudfront.mdx @@ -158,6 +158,29 @@ Lastly, we're going to edit the `Default (*)` behavior. 2. Select **Save changes**. +### Additional behaviors for layout stability + +To prevent layout shifts and ensure smooth navigation, add these additional behaviors for static asset handling: + +#### `/mintlify-assets/_next/static/*` + +Create a behavior with a **Path pattern** of `/mintlify-assets/_next/static/*` to serve static assets efficiently: + +- Set **Origin and origin groups** to your `.mintlify.dev` URL +- Set **Cache policy** to **CachingOptimized** +- Set **Origin request policy** to **AllViewerExceptHostHeader** + +This behavior should be ordered **above** the default behavior in your behaviors list, as CloudFront evaluates them in order. + +#### Update default behavior for app router navigation + +For your **Default (*)** behavior, ensure these settings to handle HTML and app router navigation properly: + +- Set **Cache policy** to **CachingDisabled** (since RSC ?_rsc= payloads vary and shouldn't be cached) +- Set **Origin request policy** to **AllViewerExceptHostHeader** + +These configurations prevent the sidenav from snapping up and down during navigation by ensuring only the new page's MDX content is fetched while keeping layout assets stable. + ### Check behaviors are set up correctly If you follow the above steps, your behaviors should look like this: @@ -208,4 +231,4 @@ Now, we're going to bring the functionality of the CloudFront distribution into Your documentation is now live at `/docs` for your primary domain. - + \ No newline at end of file