How can I improve my site's speed and performance?

[Livho123]

My site has very low performance, in comparison to other Shopify sites, In order to make my site lightweight, what are the possible ways?

[oscprofessional]

@Livho123 ,

First of all use light weighted theme for your store.

Speed of a website is a very important part of business because it affects sales. So it is very important if you choose an optimized theme that increases your website or store speed. In shopify many themes are generally well optimized and no need to do more work for optimization.

There are many themes available in shopify that are well optimized.

1. Prestige Theme
2. Flex 
3. Turbo 
4. Shoptimized
5. Boostertheme
6. Shella
7. Fastor 
8. Debutify

Optimizing your Shopify store is time-consuming. Themes are made up of Liquid, HTML, CSS, and JavaScript code. When you edit or customize the themes, file sizes can increase and affect your store speed.

Google Page Speed Insights is a free tool to help you find and fix issues slowing down your web application. Get your Page Speed score and use Page Speed suggestions to make your web site faster through our online tool.

Check your site in the page insight chrome tool. & Solve all the possible issues.

You should remove the unused app code. It will be beneficial to your store. and makes your theme code easier to read.

You need to work on following points :

• Theme Upgrade if there is a scope and upgraded theme available
• Reduce JS Payload.
• Use Critical CSS .
• Replace GIFs With Static Images
• Reduce Large Image Sizes
• Migrate Tracking Codes To Google Tag Manager
• Compress Images
• Limit Third Party JavaScript & Shopify Apps
• Preload Web Fonts. 
• I would suggest limiting to one and using a standard web font.

By fixing these issues, your website speed score can definitely improve.

Read More:

https://www.oscprofessionals.com/blog/shopify-speed-optimization-guide/

Have a nice day !

[DeepVyas]

Remove the unwanted/ disable apps installed on your store. 

Also CSS/JavaScript optimize apps are available on marketplace 
Check the images uploaded on homepage slider, category, products are Photoshop

[AvadaCommerce]

Hi @Livho123,

When it comes to site speed, please note that there are several factors impacting your online store speed, some of which you can control, others you cannot.

Factors you can't control

• Your customer's device, network, and location

• Shopify infrastructure

• Content delivery network (CDN)

• Local browser cache

• Server-side page cache

• The assets inside the content_for_header Liquid tag

Factors you can control

• Unnecessary Apps

When you add apps to change the functionality or appearance of your online store, they add code into the theme so they can run. Some code can be removed or reordered to improve your online store's performance. If you're not using an app, then you can remove it.

• Themes

Themes are made up of Liquid, HTML, CSS, and JavaScript code. When you edit or customize themes, file sizes can increase and affect your store speed.

• Complex or inefficient Liquid code

You can edit almost all of the Liquid that is used to render your store. There are efficient and inefficient ways of writing Liquid code. Doing complex operations repeatedly can increase your Liquid render time, which impacts your overall store speed.

• Images and videos

High-resolution images usually require large files and therefore slow down page loading times.

• Fonts

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.

I suggest you try AVADA SEO Suite which has great features that can help you with improving site speed such as Image Optimization, Speed Up, Lazy Loading, and Minification (removes unnecessary information from the source code). 

You can also refer to this Shopify post about Improving Speed.

I hope my answer can help you achieve your goals.

[flareAI]

Hello @Livho123,

The faster your site is, the more users you are likely to convert.

Follow the below tips that will help you decrease the load on your web pages.

1. You can run the Shopify Theme Inspector for Chrome to identify the lines of code that are slowing down pages in your online store.
2. 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. You can try some tool like https://tinyjpg.com/.
3. Removing unused app code is a best practice that avoids running code for unused features, and makes your theme code easier to read.
4. Use a theme which is optimized for performance means a theme which is responsive, fast, and takes minimal time to load the page.
If you choose a theme with numerous sliders, fancy animations, advanced navigation systems, etc., will affect your page speed. If your theme is loading slow, consider disabling the theme features you don't need.
5. Themes contain CSS, JS, HTML which can increase and affect your store speed. So disable theme features you don't use.
6. Loading extra data your customers aren't using can impact your store speed without adding value.
7. 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.
8. 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.
9. Replace GIFs with static images
10. To reduce the initial load time, you can use Lazyload technique
11. Remove third-party JS scripts and Shopify App which you are no longer 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.
12. Minimize HTTP requests. For example: Combine & inline your CSS scripts
13. Avoid unnecessary redirects and fix broken links
14. Use minified CSS and JS files
15. 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.
16. You can use Google PageSpeed Insights to view more detailed metrics for pages in your store.

Google Search, the world's largest and most trusted FREE ecommerce channel will show more of your store to customers on Google Search if your site is fast. So 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.

Hope this was helpful,

Gina
Add flareAI Shopify App today!

[Cedcommerce]

Hello @Livho123,

Here are some points that will improve your page speed and make your Shopify site lighter and faster.

1. Remove unused JavaScript.
2. Eliminate render-blocking resources.
3. Use minified CSS and JS files.
4. Replace GIFs with Static Images.
5. Reduce large image sizes.
6. Image compression is important for faster loading web pages. Make sure your images are of good quality.
7. Avoid too many images on a single page. 
8. Prioritize fonts from the Shopify admin panel.
9. Use Font-display property as swap.
10. Replace GIFs with static images.
11. Remove third-party JS scripts and Shopify App which you are no longer in use.
12. Disable unused app features.
13. Clear app data while removing an unused app.
14. Avoid multiple page redirects.
15. Use video formats for animated content.
16. Preload the LCP image.
17. Avoid large layout shifts.
18. Set width and height on image elements to reduce layout shifts and improve CLS.
19. Avoid large GIFs for animated content, consider using MPEG4/WebM videos for animations and PNG/WebP for static images.
20. Apply lazy loading on video.

Hope it helps, if you still need any help let us know.

All the best! 

Team CedCommerce.

[Stacy_Zhuk]

Hi @Livho123,

In my opinion, at first, you need to investigate what’s causing your website to load slowly. Sometimes implementing a wrong solution to the problem can have a negative impact on your website speed too. Assess the current state of your website’s load time using online tools like Google PageSpeed Insights, Lighthouse, GTmetrix, or WebPageTest.

Then, you can apply any of these tips to speed up your website:
upgrade your hosting plan
use a CDN
reduce the number of HTTP requests
minify and combine CSS, JavaScript, and HTML files
enable Gzip compression
optimize the size of your images
leverage browser caching
eliminate unnecessary functionality
reduce the number of redirects
implement lazy loading

This article https://whidegroup.com/blog/shopify-performance-optimization/ covers everything you need to know about Shopify site speed optimization.