This blog is part three of a multi-part analysis on the different technical approaches to A/B testing and personalization. In part one and two, we offered a deeper analysis on the most important technical considerations when implementing client-side rendering and server-side rendering. In this post, we will compare the two at a high-level.

Rendering options when it comes to A/B testing and personalization

As the web has matured over the years, it has become an essential marketing best practice to both experiment with and personalize the experiences that websites provide their users. Over time, vendors in the space have settled on two primary approaches to A/B testing and personalization:

• Client-side
• Server-side

We’ve summarized the definitions and differences between the approaches below:

Now, let’s dig a little deeper into each one.

How client-side testing and personalization works

The client-side approach is by far the most common solution employed in the market today. In this approach, all tests and experiences are rendered from the client-side browser, using Javascript.

So, what is client-side rendering?

When a vendor asks you to place their Javascript tag(s) into the HTML of all your site pages, Javascript-based testing and personalization SDKs can then be injected onto your site. Along with their core SDKs, vendors embed code representations of the campaigns that you define from their UIs. Once the tags are on your site, the vendor can execute all necessary logic to test and personalize the content on your pages, using client-side Javascript.

The page modification technique is the same across all vendors – a piece of code in the SDK performs an action based on the desired use case.

A few client-side rendering examples:

• Identifies one or more elements on the page via DOM selectors, then executes Javascript code to modify such element(s). Examples: hide, remove, move, duplicate, change attributes, change CSS styling, and so on

• Identifies one or more elements on the page via DOM selectors, then executes Javascript code to replace the element(s) with new content

• Identifies one or more elements on the page via DOM selectors, then executes Javascript code to insert new content before or after the element(s)

• Injects global CSS styles onto the page, changing the styling of elements on the page

• Injects other Javascript code onto the page, which can be used for a variety of open-ended use cases (e.g. inserting a 3rd-party library, making an AJAX request, calling an API, etc.)

How server-side testing and personalization works

While traditional client-side implementations call personalization services from the browser via Javascript, server-side integration enables organizations to call the personalization service before the page is rendered, from within their proprietary technology stack.

So, what is server-side rendering?

Server-side testing and personalization is typically provided by the vendor in the form of a REST API, which is called from the rendering web application (server) before the page is served. Requests and responses to REST APIs use the JSON format for data, a widely adopted and efficient way of representing data.

In pure server-side integration, your server securely interacts with an API Gateway, passing the details of the page request and asking for relevant personalization experiences.

The response is typically a JSON payload. It is then the caller’s responsibility to parse the response and act on it. You will also need to report back any engagement with the chosen experiences or significant user events. Engagement and events are reported in a similar manner (POST to and API endpoint) to personalization.

Because server-side personalization occurs within your web application stack on the back end, successful implementation requires thoughtful design and development by your tech team.

Server-side rendering use case examples:

• Major structural changes to the page
• Full-page redirects
• Secure access to back end systems (pricing models, real-time inventory)
• Pre-render personalization of Single Page Apps

Which one: client-side vs. server-side?

The longstanding client-side vs. server-side testing debate often concentrates on the question of convenience: which is easiest to integrate and test with?

By this metric, the contest isn’t even remotely close. Client-side testing, in which client-side JavaScript code renders tests directly on the user’s browser, beats server-side testing by leaps and bounds on the easiness scale. However, rendering on the client-side can oftentimes clash with existing technologies and emerging frameworks, not achieve the desired performance, or allow brands to expand the same customer experience into other channels.

So while the server-side approach is much more involved, the wider range of capabilities, deeper insights, and overall sophistication compensate for what the method lacks in ease and convenience. After all, delivering truly relevant experiences across the customer journey requires a centralized solution that is able to unify all data sources and activate it, regardless of the channel, device, or web technology the application is served from.

Choosing the correct approach will ultimately depend on your particular needs, technical resources, and long-term vision. If your primary users will be marketers and agility is their first priority, client-side is likely to be the best choice. On the other hand, if your tech and R&D departments will be heavily involved, or if you are planning on more sophisticated integrations, or those beyond the traditional web, server-side may well be the answer.

Going hybrid

The simplicity of the API concept means that you don’t necessarily have to make an either/or choice between server and client rendering for personalization. Some modern personalization platforms provide the ability to implement a hybrid solution, in which pre-rendered server-side testing and personalization changes can coexist with traditional client-side testing, and user engagement can be reported to the vendor directly from the browser.

The inevitable shift to APIs

Amid the proliferation of A/B testing and personalization, marketers have more tools than ever at their fingertips. But when looking at the competitive landscape, adopting advanced solutions that offer holistic, cross-channel experiences is not a luxury anymore. Doing so is quickly becoming a must if you wish to continue to effectively engage your audience and meet your KPIs. Given that, it may be time to consider jettisoning client-side testing and migrating to the server.

ICYMI, Dynamic Yield is offering a free 14-day exPerience APIs trial. Simply sign-up for access to a sandbox environment and start playing.