Choose adaptive design with Fasterize

Adaptive design is a technique in which different page templates are generated for different sized screens (mobile, tablet, desktop). This technique is different from responsive design in that the template is chosen at the server level based on the User-Agent HTTP header.

The difficulty with adaptive design lies in categorizing all browsers by type. This means maintaining and querying a database that links User-Agent headers to device types (mobile, desktop, tablet).

Fasterize manages User-Agents classification

Each request sent to the origin server contains an X-User-Agent-Class header. This HTTP header contains one of the following values:

• mobile: the request comes from a smartphone browser
• tablet: the request comes from a tablet browser
• desktop_recent: the request comes from a desktop computer browser
• old: the request comes from an old desktop browser (an Internet Explorer version older than version 10). This class is not cached by Fasterize.
• bot: the request comes from a bot (a search engine or a monitoring tool)

What’s more, Fasterize automatically segments its cache by incorporating the categorization into the cache key. This means that different versions of the same page can be cached without running the risk of serving a mobile page to a desktop client.

The golden rules: don't combine databases

At the origin server level, it’s essential to use the X-User-Agent-Class header to generate the template. Essentially, this allows template generation to be aligned with the Fasterize cache configuration. If you use your own User-Agent database (such as with Sparkow), there’s a risk that some user-agents won’t be included in the same category, which would corrupt the cache.