From 28d8e2b32314f21e894064a5f72e037bef004dd7 Mon Sep 17 00:00:00 2001 From: Chris Nowicki Date: Tue, 19 Aug 2025 17:50:00 -0400 Subject: [PATCH 1/7] added pre-render check out pages info to stencil overview --- docs/storefront/stencil/start/index.mdx | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/docs/storefront/stencil/start/index.mdx b/docs/storefront/stencil/start/index.mdx index 402c4991a..8ad975775 100644 --- a/docs/storefront/stencil/start/index.mdx +++ b/docs/storefront/stencil/start/index.mdx @@ -52,6 +52,19 @@ Stencil's use of **YAML Front Matter** allows developers to request only the obj Stencil themes can access remote objects through event hook and use the hooks to trigger defined events based on shopper behavior. This will allow you to collect product data and optimize a shopper's experience. To facilitate theme-building, BigCommerce provides [stencil-utils](/docs/storefront/stencil/utils/reference) -- a client-side library for managing event hooks. +## Pre-rendered Checkout pages + +All stencil themes utilizes the [Speculation Rules API](https://developer.mozilla.org/en-US/docs/Web/API/Speculation_Rules_API) to pre-render checkout pages, improving performance and user experience. + +### Limitations + +- Currently only works if the shopper is using the Google Chrome browser. Check [browser compatibility](https://developer.mozilla.org/en-US/docs/Web/API/Speculation_Rules_API#browser_compatibility) to see latest browser support. +- The checkout won't pre-render if the shopper updates their cart on the cart page. + + + If you are hosting your own analytics you'll need to make changes to your implementation to ensure compatibility. See [analytics documentation](https://developer.bigcommerce.com/docs/integrations/hosted-analytics) for more information. + + ## Blueprint (Legacy framework) From 5df801cf708a32f455b539094c24ea81d7e3887c Mon Sep 17 00:00:00 2001 From: Chris Nowicki Date: Wed, 20 Aug 2025 09:56:29 -0400 Subject: [PATCH 2/7] fixed grammatical errors --- docs/storefront/stencil/start/index.mdx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/storefront/stencil/start/index.mdx b/docs/storefront/stencil/start/index.mdx index 8ad975775..3c31ce80d 100644 --- a/docs/storefront/stencil/start/index.mdx +++ b/docs/storefront/stencil/start/index.mdx @@ -54,7 +54,7 @@ Stencil themes can access remote objects through event hook and use the hooks to ## Pre-rendered Checkout pages -All stencil themes utilizes the [Speculation Rules API](https://developer.mozilla.org/en-US/docs/Web/API/Speculation_Rules_API) to pre-render checkout pages, improving performance and user experience. +All stencil themes utilize the [Speculation Rules API](https://developer.mozilla.org/en-US/docs/Web/API/Speculation_Rules_API) to pre-render checkout pages, improving performance and user experience. ### Limitations @@ -62,7 +62,7 @@ All stencil themes utilizes the [Speculation Rules API](https://developer.mozill - The checkout won't pre-render if the shopper updates their cart on the cart page. - If you are hosting your own analytics you'll need to make changes to your implementation to ensure compatibility. See [analytics documentation](https://developer.bigcommerce.com/docs/integrations/hosted-analytics) for more information. + If you are hosting your own analytics you'll need to make changes to your implementation to ensure compatibility. See [hosted analytics documentation](https://developer.bigcommerce.com/docs/integrations/hosted-analytics) for more information. ## Blueprint (Legacy framework) From 3cda34385087138d7a21027c00e9181865bd04b9 Mon Sep 17 00:00:00 2001 From: Chris Nowicki <102450568+chris-nowicki@users.noreply.github.com> Date: Wed, 20 Aug 2025 11:25:03 -0400 Subject: [PATCH 3/7] Update docs/storefront/stencil/start/index.mdx Co-authored-by: bc-Vince <97260137+bc-Vince@users.noreply.github.com> --- docs/storefront/stencil/start/index.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/storefront/stencil/start/index.mdx b/docs/storefront/stencil/start/index.mdx index 3c31ce80d..bf4f9e7a8 100644 --- a/docs/storefront/stencil/start/index.mdx +++ b/docs/storefront/stencil/start/index.mdx @@ -62,7 +62,7 @@ All stencil themes utilize the [Speculation Rules API](https://developer.mozilla - The checkout won't pre-render if the shopper updates their cart on the cart page. - If you are hosting your own analytics you'll need to make changes to your implementation to ensure compatibility. See [hosted analytics documentation](https://developer.bigcommerce.com/docs/integrations/hosted-analytics) for more information. + If you are hosting your own analytics you'll need to make changes to your implementation to ensure compatibility. See our [hosted analytics documentation](https://developer.bigcommerce.com/docs/integrations/hosted-analytics) for more information. ## Blueprint (Legacy framework) From 39ae90a33b481db2ae677b493a0fadfea0cd79ad Mon Sep 17 00:00:00 2001 From: Chris Nowicki Date: Wed, 20 Aug 2025 16:25:38 -0400 Subject: [PATCH 4/7] added definition of what pre-rendering is --- docs/storefront/stencil/start/index.mdx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/docs/storefront/stencil/start/index.mdx b/docs/storefront/stencil/start/index.mdx index bf4f9e7a8..ca1d65ba9 100644 --- a/docs/storefront/stencil/start/index.mdx +++ b/docs/storefront/stencil/start/index.mdx @@ -56,6 +56,8 @@ Stencil themes can access remote objects through event hook and use the hooks to All stencil themes utilize the [Speculation Rules API](https://developer.mozilla.org/en-US/docs/Web/API/Speculation_Rules_API) to pre-render checkout pages, improving performance and user experience. +**Pre-rendering** means the browser begins loading a page in the background (for example, when a shopper hovers over or is likely to click a checkout link) so that it appears almost instantly when opened. + ### Limitations - Currently only works if the shopper is using the Google Chrome browser. Check [browser compatibility](https://developer.mozilla.org/en-US/docs/Web/API/Speculation_Rules_API#browser_compatibility) to see latest browser support. From d4525172c86865a5c9ceaed66c12389a2eacae62 Mon Sep 17 00:00:00 2001 From: Chris Nowicki Date: Tue, 16 Sep 2025 10:26:34 -0400 Subject: [PATCH 5/7] Updated for non-custom checkout limitation --- docs/storefront/stencil/start/index.mdx | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/docs/storefront/stencil/start/index.mdx b/docs/storefront/stencil/start/index.mdx index ca1d65ba9..01655f260 100644 --- a/docs/storefront/stencil/start/index.mdx +++ b/docs/storefront/stencil/start/index.mdx @@ -60,6 +60,7 @@ All stencil themes utilize the [Speculation Rules API](https://developer.mozilla ### Limitations +- Currently only works for non-custom checkout pages. - Currently only works if the shopper is using the Google Chrome browser. Check [browser compatibility](https://developer.mozilla.org/en-US/docs/Web/API/Speculation_Rules_API#browser_compatibility) to see latest browser support. - The checkout won't pre-render if the shopper updates their cart on the cart page. @@ -67,6 +68,10 @@ All stencil themes utilize the [Speculation Rules API](https://developer.mozilla If you are hosting your own analytics you'll need to make changes to your implementation to ensure compatibility. See our [hosted analytics documentation](https://developer.bigcommerce.com/docs/integrations/hosted-analytics) for more information. + + Custom checkout pages are not supported. This includes B2B checkout pages and any checkouts that are using the [Checkout SDK](https://developer.bigcommerce.com/docs/storefront/cart-checkout/checkout-sdk). + + ## Blueprint (Legacy framework) From a3a9ce82ff96d7b0a4896a439502d21814e9357a Mon Sep 17 00:00:00 2001 From: Chris Nowicki Date: Tue, 16 Sep 2025 10:46:40 -0400 Subject: [PATCH 6/7] Update for Vince's Comment --- docs/storefront/stencil/start/index.mdx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/docs/storefront/stencil/start/index.mdx b/docs/storefront/stencil/start/index.mdx index 01655f260..5753e4104 100644 --- a/docs/storefront/stencil/start/index.mdx +++ b/docs/storefront/stencil/start/index.mdx @@ -61,7 +61,8 @@ All stencil themes utilize the [Speculation Rules API](https://developer.mozilla ### Limitations - Currently only works for non-custom checkout pages. -- Currently only works if the shopper is using the Google Chrome browser. Check [browser compatibility](https://developer.mozilla.org/en-US/docs/Web/API/Speculation_Rules_API#browser_compatibility) to see latest browser support. +- Currently only works if the shopper is using Google Chrome and Edge based browsers. Check [browser compatibility](https://developer.mozilla.org/en-US/docs/Web/API/Speculation_Rules_API#browser_compatibility) to see latest browser support. +- Does not work on iOS. - The checkout won't pre-render if the shopper updates their cart on the cart page. @@ -69,7 +70,7 @@ All stencil themes utilize the [Speculation Rules API](https://developer.mozilla - Custom checkout pages are not supported. This includes B2B checkout pages and any checkouts that are using the [Checkout SDK](https://developer.bigcommerce.com/docs/storefront/cart-checkout/checkout-sdk). + Custom checkout pages are not supported. This includes B2B checkout pages and any checkout pages that are using the [Checkout SDK](https://developer.bigcommerce.com/docs/storefront/cart-checkout/checkout-sdk). ## Blueprint (Legacy framework) From d1339728ba905dacb8dd94f721961ba2e8e98b2e Mon Sep 17 00:00:00 2001 From: Chris Nowicki Date: Wed, 17 Sep 2025 09:17:33 -0400 Subject: [PATCH 7/7] Update for Charles Ho comment --- docs/storefront/stencil/start/index.mdx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/storefront/stencil/start/index.mdx b/docs/storefront/stencil/start/index.mdx index 5753e4104..9b19e7d2d 100644 --- a/docs/storefront/stencil/start/index.mdx +++ b/docs/storefront/stencil/start/index.mdx @@ -56,7 +56,7 @@ Stencil themes can access remote objects through event hook and use the hooks to All stencil themes utilize the [Speculation Rules API](https://developer.mozilla.org/en-US/docs/Web/API/Speculation_Rules_API) to pre-render checkout pages, improving performance and user experience. -**Pre-rendering** means the browser begins loading a page in the background (for example, when a shopper hovers over or is likely to click a checkout link) so that it appears almost instantly when opened. +**Pre-rendering** means the browser begins loading a page in the background (for example, when a shopper hovers over or is likely to click a checkout link) so that it appears almost instantly when opened. ### Limitations @@ -70,7 +70,7 @@ All stencil themes utilize the [Speculation Rules API](https://developer.mozilla - Custom checkout pages are not supported. This includes B2B checkout pages and any checkout pages that are using the [Checkout SDK](https://developer.bigcommerce.com/docs/storefront/cart-checkout/checkout-sdk). + Custom checkout pages are not supported. This includes the B2B Edition checkout and any custom checkout pages built with the [Checkout SDK](https://github.com/bigcommerce/checkout-sdk-js) or forked from [Open Checkout](https://github.com/bigcommerce/checkout-js). ## Blueprint (Legacy framework)