I’m Joel from Vivify Co. we’ve opened an online retail store servicing a range of wellness, self care and feel good products. We are using Expanse Theme and found it has quite a nice range of block styles and designs to deck out the website. What we’re looking to find is a means to better optimise our current speed score of 42.
We have looked at means of bulk reducing image file sizes and file types (PNG to JPG) but found little to no improvement. Hoping you can check on what other methods of optimisation that be done to improve our speed on the website.
After determining the Long Tasks and the code blocks and web page assets that are causing them, optimizing Total Blocking Time can be possible. To optimize the Code Blocks that busy the main thread longer than 50 MS, the methods below can be used.
Reduce the Request Count of the Third-Party Scripts
Reduce the Size of the Third-Party Scripts
Minimize the Browser’s Main Thread Work
Clean the Unused Javascript and CSS Codes
Compress the Javascript and CSS Files
Implement the Code Splitting for Javascript Assets
You can choose from several fonts for the text in your online store. To avoid downloading a new font to your customer’s computer, you can use a system font.
How to avoid showing invisible text :
The easiest way to avoid showing invisible text while custom fonts load is to temporarily show a system font. By including font-display: swap in your @font-face style, you can avoid FOIT in most modern browsers.
Remove unused CSS and unused JS:
Check the assets folder of the theme and remove unused CSS and JS file
Check and remove unused apps
If your store has not installed any app you can comment {{ content_for_header }} code in the theme.liquid (not recommended if you don’t have knowledge about the liquid)
By fixing these issues, your website speed score can definitely improve.
Greetings from flareAI app helping Shopify merchants get $7Million+ in sales from Google Search, on autopilot! I am Gina, and I am here to help.
Here are several steps you can take to optimize your Shopify website.
Select a Shopify theme that is optimized for speed and responsiveness. A fast-loading website is crucial for retaining visitors and improving search engine rankings.
Properly size images. Serve images that are appropriately-sized to save cellular data and improve load time. Use tools like TinyPNG before uploading images to your Shopify store. Also, leverage Shopify’s built-in image optimization features.
Reduce the number of external scripts, stylesheets, and fonts that your site loads. Each request can impact page load times, so consolidate and minimize them when possible.
Use a Content Delivery Network (CDN). A CDN distributes your website’s content across multiple servers around the world, delivering it from the server closest to the user. This can significantly improve loading times.
Configure your server or use Shopify’s settings to enable browser caching. This stores certain elements of your website on a visitor’s device, allowing faster load times for returning visitors.
Third-party code can significantly impact load performance. Limit the number of redundant third-party providers and try to load third-party code after your page has primarily finished loading.
Prioritize mobile users by ensuring a mobile-responsive theme for seamless browsing, minimize redirects to prevent loading delays, reserving them for essential SEO or URL updates, and enhance load times by implementing lazy loading for images and media, loading content as users scroll.
Optimize your homepage with prominent product showcases, clear navigation, and minimal clutter, ensure easy navigation through well-defined categories and a search bar, streamline the checkout process to reduce abandonment with guest options and concise forms, and enhance customer decision-making and reduce returns by providing detailed product info and high-quality images.
Implement structured data (Schema markup) to help search engines understand your content better, potentially leading to enhanced search result appearances.
Write compelling and descriptive meta titles and descriptions for each page to improve click-through rates in search engine results.
Utilize tools like Google PageSpeed Insights or GTmetrix to pinpoint areas for faster page loading, consistently analyze Shopify analytics to uncover bottlenecks and optimize user experience, and conduct A/B tests on various website elements for audience-specific enhancements.
Enhance website security with SSL certificates for secure connections and improved SEO rankings, optimize on-page SEO by incorporating keywords, unique content, and quality backlinks, and maintain website and plugin updates for compatibility, security, and peak performance.
Reduce unused JavaScript and defer loading scripts until they are required to decrease bytes consumed by network activity.
Avoid an excessive DOM size. A large DOM will increase memory usage, cause longer style calculations, and produce costly layout reflows.
Don’t hesitate to ask if you need any further clarification. If you find the answer helpful give it a Like and ✓ Mark it as an Accepted Solution.
I have checked your site in the Google Page insights tool. There is a low score on your website. It needs to be improved, especially on mobile devices.
First of all, I must tell you that you’ve got an amazing website.
Well, I agree with you that a slow-loading website can be very concerning, as it impacts the user experience of the website, and also hampers its ranking on SERP.
So, here are some ways that you can consider to improve the ranking of your website:
Remove the unused or unnecessary JavaScript and CSS
Implement AMP (Accelerated Mobile Pages), which is an open-source HTML framework that allows Google to store the cached versions of these pages in the server and reduce the loading time of the website on mobile devices
Minify JavaScript by using GZIP textual compression