2020 eCommerce Website Stack Essentials to Drive Business Growth

2020 arrived with new eCommerce website speed standards. To become a sub-second website, a modern frontend is required on top of the right infrastructure.

While the largest retailers used to dominate Google’s search results, we are beginning to see smaller eCommerce websites outrank the online giants, like Amazon and Williams-Sonoma, with even greater experiences due to nearly instant load times. Over the course of a decade, Google has been implementing tools to lay the foundation for a faster web, and it’s clearer than ever that eCommerce website speed is becoming one of the biggest telling signs whether your site will sink or swim in 2020 and beyond.

Just two years ago, the average site took a painfully long 16 seconds to load on mobile. Today, the average eCommerce website still takes 3-5 seconds, but it’s becoming more evident that sub-second websites provide a superior solution on all fronts, from SEO, traffic and revenue wins to user engagement and retention improvements. However, many eCommerce companies, even enterprise eCommerce, are stuck in a never ending cycle of website speed optimization, which might get you from slow to fast (i.e from 22 second loads to 3-5 seconds), but they will not help you break the 1-second barrier.

The 2020 New Year arrived with new website speed standards. Google’s 2019 Speed Update along with the threat of slow-load website ‘shaming', and the new ‘1-second club’ are all driving forces that have and will continue to move the needle on ‘acceptable’ and ‘desired’ website speed. To put it simply, to remain competitive you must invest in websites speed to deliver lightning-fast experiences that delight your customers and search algorithms.

The almighty Google and SEO

Since 2009, Google has been doing everything in its power to facilitate a faster internet. In 2010, desktop website speed became a ranking factor; in the years following, PageSpeed tools consistently rolled out; in 2015, The AMP Project was initiated; 2018, mobile-first indexing was introduced, and in 2019, mobile site speed became a ranking factor, officially making the mobile experience non-negotiable.

This year, Google will experiment with a ‘Badge of Shame’ to warn visitors of sites with historical latencies the moment they click-through from the SERP. This is a radical shift from the search giant’s past initiatives, where communication is historically kept between the search giant and the company (e.g. SEO and search rank fluctuations are visible to website owners, not customers). This new initiative is the most consumer-facing and may be detrimental to a business. Today’s consumers crave speed, and seeing that a site is expected to lag will immediately cause high stress levels and drive customers to one of your faster-loading competitors.  

See this on the 'Chromium Blog'

Native apps have changed the way consumers interact with digital experiences. They demand engaging experiences that load instantly. Thankfully, that experience is no longer the sole domain of native applications. Cutting-edge frontends, like Accelerated Mobile Pages (AMP), Progressive Web Apps (PWAs), and Single Page Applications (SPA) are built for speed. PWAs combine the experience we love from apps, with the reach of the web. AMP delivers nearly instant page loads from search, averaging at half a second. The search giant recommends that eCommerce websites deliver AMP supported PWAs for the fastest customer journey from landing through checkout.

Get your copy of Google’s 2019 customer journey for eCommerce to learn more about the search giant’s recommendations and how to fulfill without writing your website twice.

PWAs/SPAs have been gaining popularity across industries: Twitter, Tinder, Gmail, Netflix, Forbes, Walmart and Target are just a few examples. Even Google and Apple are now allowing this new wave of mobile technology into their app stores (as Trusted Web Activities, or TWAs). TWAs look and act like native apps, with ‘Add to Homescreen’ functionality, offline browsing, and speedy page transitions.

However, there is more to your website than the frontend. For eCommerce websites to become sub-second, a modern frontend is required on top of the right infrastructure. Personalizations, campaign trackers, dynamic pricing, real-time inventory lookup inevitably hinder page loads. Taking slow loading, dynamic websites to instant speeds can only be done with cutting-edge tools that span the browser, edge, and server – and the companies that have invested in optimizing speed across the stack are reaping the benefits of their investment in market share and search ranking.

Read further for the three areas eCommerce websites need to invest in to gain a competitive advantage.

eCommerce website stack essentials for fast page loads

Website speed is difficult for eCommerce to address due to the unique nature of their websites (with dynamic pricing, etc.) as well as their traditional stack, which tends to be monolithic. Here are the steps you need to take to break the 1-second barrier in 2020:

Headless Architecture

A headless architecture is the practice of separating a website (what the user sees) from its backend eCommerce platform via APIs or microservices. Going “headless” severs the tie between the eCommerce system backend logic and the website, thus limiting vendor lock-in. Headless commerce architecture also alleviates stress from the server, as processes are now compartmentalized, thus significantly increasing server response times.

"The top U.S. e-commerce brands have gone headless, including Amazon.com, Walmart, Target, and Nike, and the rest are in process or are considering it.” -Ajay Kapur, Layer0's CEO on Why E-Commerce is Going ‘Headless’

Modern Frontends

There are a couple cutting-edge frontends that rolled out in the last few years to tackle websites speed.

1. PWAs for speed

PWAs are API-first applications built in the browser. PWAs are seen as the best headless solution by many eCommerce businesses, as they provide a fast, frictionless, “app-like” experience with unlimited reach. Some use them in tandem with their native app, but since the major app stores opened their gates to TWAs, these frontends can be used to cut costs of supporting expensive native applications.

This modern tech holds browsing transitions speeds of 700-1000ms, however, their first-page loads can be slower than that of a traditional website. This is why server-side rendering (SSR) and AMP supported PWAs are necessary to ensure speedy first-page and subsequent page loads.

2. AMP for organic traffic

AMP is an open-source initiative, supported by Google, to deliver median page loads of 500ms for mobile traffic coming from organic search. Through caching and prefetching techniques, pages are pre-fetched and pre-rendered on Google servers, so it is available before the searcher even clicks on it. The result: nearly-instant first-loads from search.

On average, eCommerce websites see a 32.1% increase in organic traffic from AMP pages. However, AMP is found in few eCommerce sites compared to other industries, and it’s likely due to the fact that the AMP framework prohibits JavaScript and has tight restrictions on CSS and HTML, so in most cases, it requires re-writing the entire website into AMP HTML.

If you’re interested in supporting AMP, but not the heavy developer work, read How Layer0 Automatically Generates AMP from PWA pages.

3. SSR for the rest

SSR decreases first-page load times by translating JavaScript-heavy websites into HTML format, before they reach the browser. While this technology provides speedy first-loads for non-search visitors (email, ads, social, direct, referral, etc.), it also ensures that search engine crawlers and social bots can access and index a website properly – a basic requirement for SEO.

However, it is very cumbersome to add server-side rendering to an app after it has been developed, and tends to require managing a fleet of Node.js servers. If you’re interested in supporting SSR, but not sure where to start, read how Layer0 ensures speedy first-loads with SSR supported PWAs.

Intelligent CDN

Content delivery networks (CDN) are meant to speed up your websites, and they do some. But, when you reach out to them and complain that your site isn’t as fast as it should, or could be, they direct you back to the application, indicating that on-page optimization would be the way to fix your page load issue. The issue is not so much in your specific CDN as in the industry.

Web tech has changed dramatically in the past few years, but CDNs have not changed in 20 years. They still operate on the URL level, making it very cumbersome, if not impossible for a large website that runs and tracks campaigns via URL parameters, like UTMs, to understand and optimize a website for speed. Every unique URL is deemed as a unique page, thus rendering it uncachable and significantly adding to its load time.

Layer0's CDN-as-Code brings intelligence to the edge. It helps business owners decipher trends and opportunities for optimization by categorizing similar pages as such (for example PDP, PLP, and Cart) so that you can take action and see a difference in website load times.

Overall, Layer0's CDN-as-Code has a 95%+ cache hit ratio for dynamic content at the edge, enabling enterprise eCommerce websites to stay 5 seconds ahead of the shopper, no matter where she taps.

If you only focus on optimizing your frontend for speed, you will continue to be trapped in the endless cycle of speed optimization. You will see improvements, but not in the pace or caliber you need to move the needle and remain competitive in 2020 and beyond.

Bottom line

Over the course of a decade, Google has made website speed a priority. This year, the search giant will start to test ways of flagging historically slow loading sites as such to searchers when they click on an organic result.  

eCommerce sites are now coming face-to-face with the investment necessary to gain online growth to secure and boost their bottom-lines. It is now more important than ever for revenue-generating websites to acquire the right technology and tools to join the one-second club and deliver instant websites.

Typically, these speed improvements would require a complete website re-write, a fleet of Node.js servers, or both and still keep you in a cycle of small, incremental improvements to site speed. With Layer0, the effort is vastly diminished, and results are consistently sub-second with median page loads of 320ms (LCP).

With Layer0, you can go headless in less than 12 weeks on your current eCommerce platform. AMP and SSR are automatically supported out-of-the-box and Layer0's CDN-as-Code brings 95%+ cache hit rates for dynamic content at the edge.

Join industry leaders, the likes of 1-800-Flowers, Venus Fashion and AKIRA who reap the benefits of instant sites, by scheduling a consultative conversation with one of our experts and gain a competitive advantage and rank above your competitors.

Want to take your site to the next level?
Join the Layer0 Newsletter for the latest updates on performance.
Thank you! You've been added.
Oops! Something went wrong.
Thanks for registering, you're being redirected!
Oops! Something went wrong.

Don't wait another second. Go instant.

Get started in seconds