Don't use AJAX for personalised content

Content caching can decrease the time it takes to load a web page.

But it doesn’t work if the page contains personal content because one user may receive another user’s personal content which is a breach of privacy and just doesn’t work.

This can lead to the use of AJAX to load in the personalised content as a separate request which has a number of drawbacks.

Before explaining them, I‘ll first define what I mean by personalised content.

# Personalised content

Personalised content is content that is specific to a user.

At the most basic level, a “sign out” link is personalised because it means the system knows the user is signed in.

This type of personalised content is cacheable because you can segment the cached content into 2 huge groups of users: signed in and signed out.

With a cookie check, the user can be given the page they need.

But other information like the user’s name or contents of their shopping basket cannot be cached because that’s completely unique to the user.

# The problems with using AJAX to provide personalised content

# 1. It excludes people who don’t have JavaScript

User without Javascript, will get an incomplete or broken page. Not being able to sign out or see the contents of their shopping basket would be unacceptable.

# 2. It makes the page slower to load

Instead of a single HTTP request for the page there will be multiple.

The first contains the generic, cached non-personalised content which will be fast.

But the subsequent AJAX requests will hit the server which will be subject to the same slower latency anyway. Plus AJAX requests cannot be chunked making them slower than a normal HTTP response.

On top of that you‘d need additional code for the logic to fill in parts of the page and handle errors and things. And the cost of reflows and repaints isn’t trivial.

# 3. It degrades the experience

Using AJAX to load content means that users need to be shown a custom loading indicator which is not as familiar and usually not accurate. It just spins rather than showing progress.

When there’s an error, that needs to be displayed too which is inconsistent with the default browser experience that works across all websites.

When the page first loads it will only be half rendered. And sometime later, the personalised content is injected into the page. This is jarring as the page fills in the gaps and jumps around which could cause mistakes and confusion.

Sometimes the user has started to scroll when the AJAX request finally finishes so users may not notice the newly loaded content.

# 4. It complicates the codebase

You need more complex code to handle AJX calls, and send JSON and parse it on the client. And you have to think about how you‘ll organise the partials which contain HTML and decide when personalised content isn‘t essential to the user experience.

You‘ll also need to decide how many personalised requests the client needs to make. More sounds nice from an atomic perspective but it‘ll exacerbate the problems I mentioned earlier.

# Summary

Content-caching is a useful technique when used responsibly and for pages that don’t contain personalised content.

But if you need to give users personalised content, then that‘s not a reason to use AJAX. It means you need to work on your server side infrastructure to make sure personalised content can be delivered at speed.