3 Key Steps to Faster PrestaShop Front End Performance

According to the latest Google updates, PrestaShop website speed is one of the ranking factors. So, a fast ecommerce website now can kill two birds with one stone – improve user experience and receive higher PR.

Basically, the two global factors affecting your PrestaShop performance are:

  • The server
  • The code

Your hosting company can make a huge difference to the page loading speed, but there’s not much you can do about it other than switching to another server, which would be more suitable for your needs and meeting the system requirements. Learn more about how server environment can have impact on your store functionality.

In this post, we are going to concentrate on the front end performance (the elements of the page which a user sees when browsing your store). By optimising the content of the page you can speed up its loading time.

1. Optimising images.

Quality images are necessary to provide a better view of the products, but they may consume lots of load.

  • use the right format – JPG/JPEG for photos or pictures with different colour hues. For vector images (like charts, diagrams or logos) PNG format is preferred. This will reduce the image size and speed up its loading.

  • combine images into CSS sprites - it means, you create one image file out of all images you’ve got on our site. Then, CSS code you use, tells the browser which part of the big file to display in the specific place. This feature is used to reduce the number of HTTP requests. You can create CSS sprites manually or use a number of free tools on the web to assist you.

2. Optimising CSS/JavaScript

  • combine CSS and JavaScript filesthis is the method to avoid creating an HTTP request for each of them separately. In a nutshell, you create two files – for CSS and for Java and combine them correspondingly. So, you could have just 2 files instead of multiple ones.

  • minifyCSS and JavaScript - the scripts tend to have a number of unnecessary elements like spaces, tabs etc. If you remove them – the script will work, but will be much faster to load.

  • place CSS at the top, Java at the bottom of the page – it would enable the content to start loading as soon as possible. It is important for users, as they would get instant feedback from the site. Moreover, Javascript at the top would block downloading images or css simultaneously, so it is recommended to place it in the footer.

  • keep CSS and Java externalthis way, they would be cached by the browser. If CSS and Java are inline (included in the source code) they need to be downloaded each time the page is opened. It also helps to reduce the page size and lessen the number of HTTP requests.

3. Monitoring&Measuring

This is the step to be followed before, during and after the optimization. This way, you’ll always know everything about your PrestaShop performance and possible culprits.

The monitoring tool like Shopping Cart Diagnostics will always be able to answer these questions on your store performance:

  • what’s your  PrestaShop page loading time
  • what’s your website response time
  • what’s slowing down the store
  • what should be done to speed up PrestaShop

But this is just a tiny part of the functions available to you with this automated tool.

Want to check your store availability, SEO, security, server environment and most importantly – user experience? Shopping Cart Diagnostics can do it swiftly and direct your efforts with simple solution tips.

Try it now, register an account to test your PrestaShop performance and speed up your way to the top!

P.S. More info on progressive automatic troubleshooting can be found here: http://www.shopping-cart-diagnostics.com