Michael Türk
Michael Türk Lead Solution Specialist
24. January 2018 in

English Let's talk about

Page Speed 

Why speed matters

Time is money. In e-commerce, that is even more true. Shoppers expect an entertaining customer experience and speed is a massive part of that. Never before have customers been more impatient and less forgiving. If an e-commerce site does not provide the expected quality of service, they will find another place to shop whatever they desire.
Optimizing a page for speed makes even more sense considering mobile traffic surpassed desktop traffic over a year ago and is still massively growing in traffic shares. Mobile conversion rates on the other hand are still much lower than their desktop counterparts and speed is a big factor in this as well. According to Google 40% of mobile users leave shops if the page takes longer than 4 seconds to load. Amazon had already discovered in 2006 that another 100ms in loading times result in a 1% drop in revenue. The equation is a no-brainer: Faster e-commerce sites equals more revenue. On desktop and on mobile.

What is good page speed then?

Unfortunately, there is no clear answer to what decent page speed actually is. It depends on the customer, their current context, the desired product and many more parameters. According to Pingdom the top 50 e-commerce websites took on average approximately 2.51 seconds to load, with the fastest being done less than half a second, while the slowest took more than 8 seconds. From my experience, most of the e-commerce platforms out there perform even worse than the average top e-commerce websites when it comes to page speed.
How can you improve our loading times then? To do this, we have to understand how pages on the web are actually generated and what loading times are made up of.

  1. The browser requests the current page from the server. E-commerce pages generally don’t consist of static files that can download on demand. They are rather made of  dynamically generated files produced by a programming language like PHP. The web server uses these programming languages to gather all needed information to put together information about products, the cart, the current user and whatever is interesting on that particular page. That may involve a considerable amount of complexity that takes time to produce and deliver.

    Since most of the platforms are not fast enough in dynamic content generation, they introduce front-end caching based on software like Varnish or other full-page caching tools. These systems help because content is generated once - which is slow -, and then saved to the system’s memory. This means the page reacts pretty slowly for the first customer and much faster for everybody afterwards who loads the the page in its saved form.

    Full-page caching comes with a couple of downsides that are show stoppers for modern e-commerce:

    • Full-page caching makes dynamic content for personalization much harder. Sure, there are mechanisms like Ajax or ESI, but they won’t help a lot if the overall performance of a system sucks.
    • Additionally, adding another level of complexity often results in a lot of extra development time. Developers have to make sure, the generated contents comply with context-specific outputs. From my experience, this can add a few days of work to a feature of less than a couple of hours.
    • Full-page caching sounds really nice at first, but according to most statistics the efficiency is generally pretty low. This is due to an extremely high number of pages in an e-commerce website that have to be generated at some point in time and the amount of regular updates caused by changes in prices or availability that invalidate cached versions.
    • In the end, there are a lot of things that can’t be cached at all. Adding products to the cart or letting the customer checkout are the most obvious cases. I experienced a lot of situations, where Varnish could handle the customer rush on product pages but the system would then not be able to handle the amount of add-to-cart operations. I mean, really? That’s your ultimate goal. You did everything perfectly and then the platform fumbles the ball on the 1 yard line.

    In the end, a full-page cache empowered ecommerce system is exactly the opposite of a modern shop that provides customer-specific optimized contents. This includes, providing promoted products on the homepage, individually sorted category listings, customizable filters or dashboards and customer-specific prices. A state of the art shop, is not cacheable by definition. If you cache your output, it will come back to bite you in the future when it comes to conversion rate optimization.

  2. Often the second part of performance optimization is forgotten: After the browser receives the generated HTML, it interpretes the code and downloads all linked resources like images, scripts and styles. There is a lot of potential for optimization in 98% of the cases and front-end code has evolved significantly over the past couple of years. Writing better code, creating optimized resources and optimizing server settings can often cut response times by 20% or more. Every time you want to add another service hooked in via JavaScript, you should ask yourself: is this worth the additional processing time?!

Lightning-fast ecommerce solutions powered by Spryker

Whenever I talk to some of my good old buddies from my Magento times about how Spryker provides response times of a split second, I get those lovely letters of disbelief: “WTF?”. They can’t even believe that’s possible with a native PHP application. And I promise you: it is possible. I just used Pingdom to test some of our publicly available customers for page speed. Here is how they performed: 

(for clarification: I tested the homepages, a couple of category pages as well as product detail pages for a quick test. And yes, the response times are compared to all websites, even though most of them are much less complex than e-commerce!)

 

The numbers speak for themselves: Spryker enables you to provide lightning fast e-commerce applications to your customers. We can do that because of our modern architecture that is built for flexibility, performance and scalability. Without the downsides of full-page caching. Pure e-commerce 2018-style with all the personalization you can imagine. Leverage that speed, provide your services in no time.

Because you know: Time is money.


 

Subscribe to our newsletter

Let’s Talk About… the Series.

Sounds interesting? We could talk about Spryker all day long and why it’s the e-commerce platform of choice in 2018. But that would go beyond the scope of a single document - even more than this one does already. That’s why we decided to make this a weekly series covering one topic at a time including how Spryker helps developers and merchants to succeed in a multitude of different areas. There are lots of different interesting topics to cover like agility, page speed, personalization, security, code quality, product management, order management and much more. 

If there is any topic you would like us to cover, please just drop me an email to michael@spryker.com. On Twitter you can contact me as well: my handle is @drlrdsen. We love challenges and will gladly hear out your input because just like in e-commerce our most important KPI is customer satisfaction.

About Michael Türk

I am Lead Solution Specialist at Spryker and I coordinate the technical and content requirements of our customers. With over 10 years of e-commerce experience in more than 100 different projects with different platforms such as Magento, Oxid and Spryker, I have gone through a wide range of projects. In the course of this process, I have seen many established companies having a tough time in digital business and celebrating surprising successes that no one had expected. From a retrospective perspective, you can see many patterns in successful projects, which helps projecting them onto future projects.

Get all new updates straight to your inbox