--- title: Preload checkout description: Load checkout in the background so it's ready before the buyer needs it. source_url: html: 'https://shopify.dev/docs/storefronts/mobile/checkout-kit/preloading' md: 'https://shopify.dev/docs/storefronts/mobile/checkout-kit/preloading.md' --- # Preload checkout Preloading fetches checkout in the background. When the buyer taps **Checkout**, checkout is already loaded and opens with no delay. *** ## Requirements * [Checkout Kit](https://shopify.dev/docs/storefronts/mobile/checkout-kit) installed in your app. * A valid `checkoutUrl` from [Build a mobile storefront](https://shopify.dev/docs/storefronts/mobile/build-mobile-storefront) or a [cart permalink](https://shopify.dev/docs/apps/build/checkout/create-cart-permalinks). *** ## Enable preloading When the buyer navigates to the cart, call `preload()` to start fetching checkout in the background. By the time they tap **Checkout**, the page is ready: ## Preload checkout ##### Swift ```swift ShopifyCheckoutSheetKit.preload(checkout: checkoutURL) ``` ##### Kotlin ```kotlin ShopifyCheckoutSheetKit.preload(checkoutUrl, context) ``` ##### React Native ```javascript // using hooks const shopifyCheckout = useShopifyCheckoutSheet(); shopifyCheckout.preload(checkoutUrl); // using a class instance const shopifyCheckout = new ShopifyCheckoutSheet(); shopifyCheckout.preload(checkoutUrl); ``` **Caution:** Avoid calling `preload()` on every add-to-cart action. Frequent preloading triggers background network requests, increases memory usage, and might trigger Storefront API rate limits. *** ## Manage preloaded checkouts Preloading renders checkout in a background WebView. The preloaded checkout reflects the cart at the time you call `preload()`. When you call `ShopifyCheckoutSheetKit.present()`, the checkout moves to the foreground. If the cart changes after preloading, call `preload()` again to refresh, or call `ShopifyCheckoutSheetKit.invalidate()` to clear the cache. Closing checkout doesn't automatically invalidate preloaded content, so update it when the buyer modifies their cart. Checkout Kit might delay or skip preloading during high traffic. If preloading doesn't complete before you call `present(checkoutUrl)`, then buyers see a loading state. *** ## Disable preloading To disable preloading, set `enabled` to `false`. You might disable it when a buyer enables data saver mode. When disabled, Checkout Kit ignores all calls to `preload()`: ## Disable preloading ##### Swift ```swift ShopifyCheckoutSheetKit.configure { $0.preloading.enabled = false // defaults to true } ``` ##### Kotlin ```kotlin ShopifyCheckoutSheetKit.configure { it.preloading = Preloading(enabled = false) // defaults to true } ``` ##### React Native ```jsx import { ShopifyCheckoutSheetProvider } from '@shopify/checkout-sheet-kit'; const configuration = { preloading: false }; ``` *** ## Next steps [Monitor checkout lifecycle\ \ ](https://shopify.dev/docs/storefronts/mobile/checkout-kit/monitor-checkout-lifecycle) [Handle what happens after a preloaded checkout completes, fails, or is canceled.](https://shopify.dev/docs/storefronts/mobile/checkout-kit/monitor-checkout-lifecycle) [Configure checkout branding\ \ ](https://shopify.dev/docs/storefronts/mobile/checkout-kit/configuration) [Customize the checkout color scheme and title to match your app.](https://shopify.dev/docs/storefronts/mobile/checkout-kit/configuration) [Accelerated checkouts\ \ ](https://shopify.dev/docs/storefronts/mobile/checkout-kit/accelerated-checkouts-overview) [Add Shop Pay and Apple Pay buttons for one-tap purchases on product and cart pages.](https://shopify.dev/docs/storefronts/mobile/checkout-kit/accelerated-checkouts-overview) ***