How can I increase the speed of my e-commerce site?

[2-b]

Shopify is powerful - it has outweighed Wix, Weebly or BigCommerce and only ranked after WooCommerce in the top list of e-commerce websites. However, Shopify is just a start to have a thriving business - you must optimize the page speed so that viewers will have a more excellent impression on your site.

If you are concerned about the speed of your Shopify shop, this article is written for you.

1. Compress The Photos

Images indeed play an important role in the visual appeal of a website. They make your store look more lively and vibrant, and they give customers the most complete details about products as well.

Nevertheless, high-resolution images usually require large files and therefore slow down page loading times. To avoid that, here are some suggestions for you:

• Utilize compressing tools like TinyPNG, JPEGmini, or Kraken.io before uploading images

• Utilize some Shopify apps to compress images (you can find tons of them in the Shopify store)
• Upload images with the exact dimensions for that website

2. Remove Unnecessary Apps

Once you use an e-commerce website, it’s unavoidable to use third-party apps like a chatbot or pop-up ads. Unfortunately, there is a trade-off between the multifunction and your page speed.

Let’s take a look at every app operating on your website. Do you use it regularly or it has been unused for such a long time? Is it necessary for your business or you use it just because it seems nice? If your answer is the latter one, remove it immediately. That decision will be useful for your loading page a lot.

3. Utilize AMP

Introduced to the public in 2015, AMP (Accelerated Mobile Pages) has always been favored by online shop owners for the value it brings. Through several steps, AMP will set up a fast-loading page on mobile devices for you, helping customers to enjoy wonderful shopping experiences on their tablets or smart-phones.

Implementing AMP in Shopify, however, requires the installation of other apps such as FireAMP, RocketAmp or Shop Sheriff. Besides, the process is a little bit complicated, but all of that will soon bear fruits in the future - I promise.

4. Look For Some Professionals

The three tips mentioned above are quite simple and easy to do. Nevertheless, if your site is too slow and you haven’t succeeded yet with those tips, then it’s time for you to ask for help from a trustworthy professional.

A professional will help you with many problems, such as getting rid of render-blocking CSS and JavaScript or dealing with issues related to HTML and JavaScript.

Without a doubt, advanced methods will result in better outcomes. Therefore, these solutions are worth trying if you want to attract more customers to your store.

[eStoreSpeed]

Yes! Especially the usage of AMP. I was pleasantly surprised to discover how much faster mobile is using the AMP app, although the using the app you cannot use your custom theme (have to choose from Shopify themes).

Best,

eStoreSpeedOptimization

[JoesIdeas]

Great tip with #1. For #2 rather than removing apps, I would start with removing old app code first. We often find leftover code from apps that have been deleted but not removed from the theme code (many apps add code to the theme, and access is restricted once you delete the app so it cannot cleanup after itself).

#3 (using AMP) will depend on the store design, AMP is great for simple layouts but if you have complex layouts + features, it could actually hurt your conversion rate. The way I like to test this is by creating an AMP page(s) and run paid traffic to the AMP page and the non-AMP page. If conversions are the same or better with AMP, then AMP is definitely the way to go because of the speed increase.

These are just a couple tips, but to see what specifically can be optimized for your store the Shopify Analyzer will reveal optimization issues. It's a tool my team of Shopify optimization experts built free for the community, the scoring is based off over a thousand Shopify sites we've optimized.

Both store owners and agencies use it regularly to optimize Shopify sites specifically without the poor recommendations general tools can sometimes give that can damage ecommerce sites.

[brewedhaircare]

any tips on removing coding from odd apps that were already removed?

[JoesIdeas]

@brewedhaircare you'll usually find this code in theme.liquid.

Here's our standard workflow for removing old app code:

1) Open your Apps page in a tab to see all the apps installed (or if it's your store you probably already know)

2) Duplicate your live theme so the live site is not affected.

3) On this new backup theme, open the theme editor.

4) Start with the theme.liquid file in the Layouts folder.

5) Read the code from top to bottom and look for clues related to apps you have uninstalled. For example, if you had an app called snazzy marketing app that you deleted, and you see some code like this:

{% render 'snazzy-marketing-app' %}

Then you can delete that line. If it's a render or include statement like that, there's also probably a file in the Snippets folder that you can delete.

You'll also sometimes see a script statement like this:

<script src="https://app.snazzy-marketing-app.com/abcdef.js"></script>

That would also be an indicator of leftover app code.

5) Most old app code is in theme.liquid, but for completeness you'll also want to read the code files related to collections, products, and cart. Those are the other common areas. For these you start in the Templates folder then read the code, it might include a snippet or section, you can then open up those sections and snippets and read the code there to find out.

6) Another thing we like to do, and that might be easier for you if you're not into reading code is to run each main page template (home, collection, product, cart) through tools.pingdom.com and look at the files loaded section at the bottom. This tool shows a nice interface of all files loading on the page + how long they take to load. Can reveal not only old app code but also potential bottlenecks.

If that's all boring you can reach out to my team at speedboostr.com/services for professional help, but if you enjoy tinkering I would at least give it a go on a duplicate theme, you'll get a nice look at the inside of your site and get a feel for how long different files take to load.

[chandrasekhar]

Hi,

Page speed is the biggest factor in Google rankings, but its impact is not limited to your organic visibility. For eCommerce sites, speed is always a concern as reduced page load times improve user experience and, in turn, increase conversion rates.

There are four things to keep in mind to make your Shopify site load faster.

• Compress your images
• Implement lazy loading functionality
• Get started with fast themes
• Be conservative with your apps