How can I easily speed up my online store?

[peakhost]

I'm using the free narrative theme https://www.peakhost.us/ - what can I do to speed up my store easily from Shopify?

Thanks!

[kaalTechGeeks · Accepted solution]

Hi @peakhost 
With the store URL you provided it was very helpful in telling you the exact issues for your store.
I have checked your website speed score and it is 38/100 for mobile device and 62/100 for the desktop. The scores though can not be said to be very poor but still they need significant improvement. 

  
Some of the major issues you can work on are: 
1. Eliminate render blocking resources: to fix these you need to preload the CSS files and use defer and async attributes to optimize the script files. 
2. Cumulative layout shift (CLS): you need to remove the layout shifting for the website on both mobile and desktop devices as this layout shifting reduces user experience.    
3. Defer off screen images - you need to lazy load the images of your website
4. Properly sized images: you need to work on the image optimization for your store and make sure that the intrinsic size for your images should not be much greater than the rendered size. 
5. Reduced unused JS & CSS - you need to work on lazyload the script and css files (both from shopify & coming form third party apps), but at the same time you have to make sure that the functionality of your store does not get effected. 
6.  Minify CSS and JS files - there are multiple online tools available to minimize your files you can take help from them.  
7. Ensure text remains visible during web font load: you have to optimize the font of your website using font-display: swap css property. 
8. Images do not have explicit height & width: you have to provided proper dimension to your images on the websites. 
9. Minimize main thread work:  Work on optimization of the resources coming from the apps and other third party cdns. 


So the above 9 points are the major points on which you have to work in order to ensure that you get good speed scores for the website. 

NOTE: working on the speed part for the store requires a hefty knowledge of coding in shopify liquid and javascript. So you should hire a developer if you do not have enough confidence to work with the codes. You can let me know if you are willing for speed optimization for your website. 

Thanks & Regards
KaalTechGeeks 

[Marc_Mayr]

You can reduce all the unused Javascript by using our Pagespeed optimizer app - https://apps.shopify.com/pagespeed-javascript for a lot of stores the results are quite good if you have a lot of 3rd party apps installed

[kazi]

Hello @peakhost  I have checked your store in google page speed  https://pagespeed.web.dev/report?url=https%3A%2F%2Fwww.peakhost.us%2F&form_factor=mobile

Reduce unused JavaScript

Properly size images

Reduce unused CSS

Eliminate render-blocking resources

If you click each tab you will see list of files needed to fix

If you are not familiar of them search google for each issues and follow instruction or hire any developer to do it for you.

[flareAI]

Hello @peakhost,

I'm Gina - Product Manager at flareAI. flareAI has helped Shopify stores generate $5 million in sales from Google Search, on autopilot.

If it's helpful to you, please let me know by giving it a like or marking it as a solution.

I have taken a look at your store speed and the score is 79.

The following tips will help you significantly speed up your Shopify store.

1. Image compression is important and a necessity for faster-loading web pages. Make sure your images are of good quality and do not add too many images on a single page.
2. Reduce the HTTP requests. For example: Combine & inline your CSS scripts
3. Minimize broken links and redirects - Avoid unnecessary Redirects and fix broken links
4. Using slideshow, which are high-quality images combined with transitions, take time to load when the user clicks the link to the homepage. So instead you can use a single high-quality hero image.
5. Use a theme which is optimized for performance means a theme which is responsive, fast, and takes minimal time to load the page.
6. Don't add too many images on a page
Adding too many images on a page can be frustrating. It can significantly slow the load time of your website. Also, it can overwhelm visitors, which will ultimately result in a poor user experience, a high bounce rate, and a high probability of lower rankings in relative search results.
7. Use Lazyload wherever required to reduce initial load time
8. To reduce the initial load time, you can use Lazyload technique
9. Remove all unwanted Shopify Apps which you are not using
You should disable app features you don't use, or you can remove the app if you don't need it. If you are removing an app make sure to remove code that was added as part of the app install process.
10. Replace GIFs with static images
11. Themes contain CSS, JS, HTML which can increase and affect your store speed. So disable theme features you don't use.
12. Use a System font which is a font that is already installed on most computers. For example: Segoe UI, Times New Roman. If you use a font that does not yet exist on your customer's computer, then the font has to be downloaded before your text can be displayed. This impacts the time that your store takes to load.
13. Use minified CSS and JS files

Site speed is critical for organic channel sales. Did you know, ecommerce on organic channels is greater than all paid ads and social media combined. We created flareAI to deliver feeds to organic channels on a regular basis without taking your time. flareAI helps to get your products found on Google, the world's largest FREE eCommerce service. Let flareAI help you to grow your revenue on the world's best free sales channels.

If you found the answer helpful consider supporting the Shopify Community by giving it a Like + Accept the solution.

I hope my suggestion will help you.

Gina
flareAI