Q: Themes such as {***} claim to be optimized for faster loading and also achieve superior speed for mobile. Can your themes be optimized to be lighter and faster?

Q: When I tested their demo it seemed to load very quick as compared to your demos, especially on mobile. I was wondering if this is because of the way you have setup your demos on your servers, or if your themes are heavier ?

A: Yes, our themes are loaded slower. But they were not actually optimized for speed. Our main site was optimized (this is a one time job) and web-experiment.info page weight is 3.5Mb loaded in 3.5 s; {***} theme page weight is ~0,8 Mb loaded in 2.2 s. Our demo sites are constantly changing, so the optimization would take a lot of time to handle. In other words - there are ways to optimize our themes (merge small files, put some images into css, remove unnecessary http requests etc.)

Why didn't we implement button's images in Base64 format?

A: This is for easy image replacement. Most frequently asked design related question from our clients is How to change BUY NOW button color. For the same reason we didn't place all small .gif and .png files into one .png sprite.

Once you replace all buttons and other elements images you might use following tools:

During template improvement we first think of a website beauty and usability. However we do not forget about Google ranking and page loading speed. Page loading speed is crucial for a visitor, page ranking is important for a website owner.

We have checked three responsive templates from our site.

Detailed speed test

Test a website's performance by webpagetest.org is a free website speed test from multiple locations around the globe using real browsers (IE and Chrome) and at real consumer connection speeds.

Shows the download speed for the first time and second, (do not forget about the cache), and of all graphs

Test Location: Frankfurt
Browser: IE9

Repeat view (ascending order) First view
Prefect White v3
1.2 sec4.1 sec
LightShop Green v3
2.1 sec5.2 sec
LightShop Pink v3
2.4 sec5.0 sec

Perfect White got the best page loading speed time.

Which load faster?

Users don't care about testing methodology. They just want to know which loads faster.

Whichloadsfaster is a fun way to spread the word that web performance matters. Please see result: Whichloadsfaster.com

Lightshop is faster.

What would Google say (Google performance test)

Google has a PageSpeed tools service. The PageSpeed family of tools is designed to help you optimize the performance of your website.

If to test the same page test results vary by 1-2 points from one to another.

Mobile view Desctop view Suggestions Summary
Prefect White v3
61/10076/100Eliminate external render-blocking Javascript and CSS in above-the-fold content. So you might drop "Share This" tool.
LightShop Green v3
59/10074/100Eliminate external render-blocking Javascript and CSS in above-the-fold content. So you might drop "Share This" tool.
LightShop Pink v3
65/10077/100Eliminate external render-blocking Javascript and CSS in above-the-fold content. So you might drop "Share This" tool.

All our responsive templates has almost the same result (average value 60/100 and 75/100).

Lightshop Pink has the best PageSpeed value from all tested templates. Due to small difference of the Pink template from the Green template we might say that Slider is affecting the PageSpeed tool score.

The overall code of a template gives a huge effect on the PageSpeed tool score. The code is the set of scripts and plugins.Outside scripts (Facebook like button for ex.) might slow the page dramatically. Inside scripts might be optimized, but outside scripts are out of your area of control.

Hosting is a clue when it comes to a page loading speed value. Cheap or not Magento dedicated hosting would not be able to provide good results.

As a conclusion we might say that from the point of SEO and page loading speed:

  • Google gave some recommendations to make the score better: Eliminate external render-blocking Javascript and CSS. So you might drop "Share This" tool.

We used this guide in order to implement a lazy loading: Widget load - support.sharethis.com

However web optimizer has mentioned this script. We also tried to use another way for lazy loading but due to script initialization features this way didn't work.

What is going to be done in the next version:

  • decreased CSS and Javascript
  • merged JavaScript files and CSS files in order to decrease the number of HTTP requests. This is very important for mobile devices.

Best Practices for Speeding Up Your Web Site

The Exceptional Performance team has identified a number of best practices for making web pages fast. The list includes 35 best practices divided into 7 categories: Yahoo developer network

Back

Go to contentsBack to previous page