Page speed is an important part of your online storefront experience. Pages that take longer to load can affect how customers interact with your store and may also influence search performance.
Many factors can affect storefront performance, including your theme setup, apps, third-party scripts, media, network conditions, and Shopify’s platform infrastructure. This article covers practical steps you can take to reduce unnecessary load and keep your storefront running efficiently.
Update to the latest version, minimize your apps, simplify above-the-fold content, tie up loose ends in your links, and fine-tune your images for better theme performance.
Update to the latest theme version
Keeping your theme up to date ensures you’re using the latest version available, including current features, compatibility improvements, bug fixes, and other refinements included in each release.
While updating your theme does not guarantee a specific improvement to page speed, starting with the latest version helps ensure you’re not troubleshooting an issue that may already have been addressed in a newer release.
For more information:
- How to update your Shopify theme
- Updating a theme manually
- Do I need to update my theme to the latest version?
- What changes are included in the latest theme version?
Review your apps
Apps can add valuable functionality to your storefront, but they can also introduce additional scripts, stylesheets, tracking tools, and other resources that need to load when a customer visits your store.
Review your installed apps periodically and consider whether you still need each one. If you’re no longer using an app, follow the app developer’s uninstall instructions before removing it from Shopify.
Some apps may make changes to theme files during installation. Depending on how the app was integrated, removing the app may not automatically remove all of those changes.
If you’ve already removed an app and suspect that code remains in your theme, see Resolving leftover code from 3rd-party apps.
If you’re unsure whether specific code belongs to an app, contact the app developer before removing it. They know their integration best and can confirm which files or snippets are safe to remove.
Simplify above-the-fold content
“Above the fold” generally refers to the content customers see immediately when a page first loads, before scrolling.
Because this content needs to appear quickly, adding several large images, videos, slideshows, animations, or third-party features near the top of a page can increase the amount of work required during the initial page load.
Consider simplifying this area where possible. For example, you might:
- Use a static image instead of a multi-slide slideshow.
- Reduce the number of slideshow slides.
- Avoid placing multiple video or media-heavy sections at the top of the page.
- Move non-essential sections further down the page.
Pixel Union themes use performance techniques such as responsive image loading and lazy loading where appropriate. Lazy loading allows certain off-screen resources to wait until they’re closer to being viewed rather than loading everything immediately.
Content that is important to the initial page view, however, may need to load right away. For this reason, keeping your above-the-fold content focused remains one of the most useful steps you can take when reviewing page performance.
Check links and redirects
Broken links and unnecessary redirect chains can create a poor customer experience and may result in additional requests before a customer reaches the intended page.
Periodically review links in your:
- Navigation menus
- Homepage sections
- Promotional banners
- Product and collection descriptions
- Blog posts
- Footer
You can also use a third-party broken-link checking tool to help identify URLs that no longer point to the intended destination.
When possible, update old links so they point directly to the current destination rather than relying on multiple redirects.
Optimize your images
Images are often some of the largest resources on an online storefront, so image selection can have a noticeable impact on page performance.
Pixel Union themes use responsive image techniques to serve appropriately sized images for different screen and device sizes where supported. This helps balance image quality and performance.
For more information, see Using the Responsive Images system.
You can also improve image performance by:
- Uploading images at appropriate dimensions for where they’ll be displayed.
- Avoiding unnecessarily large image files.
- Using appropriate image formats.
- Removing images that are no longer being used.
- Avoiding excessive image-heavy sections on a single page.
Responsive image handling helps optimize how images are delivered, but starting with appropriately sized and optimized source images is still recommended.
Review fonts and third-party embeds
Fonts and third-party scripts can be easy to overlook when troubleshooting storefront performance.
Fonts
Each additional font family, style, or weight may require the browser to download another resource.
Where possible, use only the font families and weights you need for your storefront design. Using several custom fonts or many variations of the same font can add unnecessary requests during page load.
Third-party embeds and custom scripts
Third-party functionality can also be added directly to theme files rather than through an installed Shopify app. Examples include:
- Chat widgets
- Review widgets
- Analytics and tracking scripts
- Marketing integrations
- Custom JavaScript
- External media embeds
These resources can affect storefront performance even if they don’t appear in your Shopify Apps list.
If you’ve added custom or third-party code to your theme, consider reviewing it with the developer or service provider responsible for the integration. Pixel Union Support can assist with the functionality and settings included with the theme, but troubleshooting or optimizing third-party and custom code is outside our support scope.
Test before and after making changes
When making performance-related changes, test your store before and after each significant adjustment.
Changing several things at once can make it difficult to determine which change affected your results.
For example, you could:
- Record your current performance results.
- Make one significant change, such as removing an unused app or reducing homepage media.
- Test the store again.
- Compare the results.
- Continue with the next change.
Keep in mind that performance test results can fluctuate between tests due to factors such as network conditions, device performance, third-party services, and other variables. Look for consistent trends rather than relying on a single test result.
More page speed resources
For additional information, see:
- Testing your store’s page speed
- Resolving leftover code from 3rd-party apps
- Troubleshooting page speed and performance issues
- Shopify Help Center: Improving your online store performance
- web.dev: Core Web Vitals
Get hands-on help
If you’ve reviewed the recommendations above and your store still requires performance optimization, you may need assistance from a developer who can evaluate your store’s complete setup, including apps, custom code, third-party scripts, and other integrations.
For hands-on development assistance, we recommend Storetasker.