An ever-growing list of individual factors can contribute to a sluggish online store. I’ve divided them into three major groups:
- Slow servers
- Big files
- Slow code
Slow servers are out of your control. Almost. They take a long time to connect to and that is their contribution to the overall waiting time. Knowing that they are slow, the only thing you can instruct the visitor’s browser to do is start connecting to servers earlier. This lets the browser prepare for downloading resources by establishing connections ahead of time and batching this process in the background, waiting to connect while working on rendering parts of the page on the screen.
Big files are obvious offenders—a big chunk of data takes longer to download than a smaller chunk of data. When you get down to what is actually needed by your store to satisfy the needs of your visitors, you can really cut down on the data transferred. Here lies 80% of the optimization potential of your Shopify store.
By the way, the compression algorithms used in the mp4, mp3 and jpeg file formats work the say way—they subtract the unnecessary, subtract what is hardly perceptible and then leave you with a believable perception of the original data. Yes, some data may be lost in the process, but the result is usually perceived as identical to the “full data” version. Same happens with images, icons, stylesheets, font files, animations/gifs and page code after they get optimized—only what is truly needed remains and everything unnecessary gets removed.
Slow code affects are rarely felt on a desktop machine, but easily perceptible on mobile. That’s because code evaluation (initial stage before running) and actual running incur can occupy the slow mobile processor for a long time, before giving way to another task, like drawing something on your screen. This stage takes 80% of time in a Shopify Speed Optimization project and is responsible for 20–30% of the improvements.