Table of Contents
In the ever-evolving world of web hosting and website optimization, every detail matters when it comes to enhancing your website's speed and performance. One such detail is the ability to track your website visitors' devices accurately.
Cloudways now offers a "Device Detection" feature, allowing you to monitor your website visitors' device types effectively. This feature, similar to GeoIP, enhances your website's performance by configuring Varnish to create separate page caches for Desktop, Tablet, and Mobile devices.
Important
The "Device Detection" feature discussed in this article is only available on Cloudways New Interface. It works only if you have Varnish enabled on your server and application. Please ensure Varnish is active before enabling this feature to optimize your website's performance effectively.
Why Should you Use Device Detection?
Device Detection provides valuable insights into the devices your visitors use to access your website. Here are some common use cases for this feature:
Tailored User Experience: Customize the user experience based on the visitor's device. For example, you can optimize your website's layout, theme, and content presentation for users with different devices, providing a seamless browsing experience.
Analytics: Gain a deeper understanding of your audience by tracking the prevalence of different device types among your visitors.
Question
Does Device Detection Improve the Performance of the Mobile Version of My Website?
Device Detection allows you to enable a mobile-specific cache for websites that generate customized content for mobile devices. If your website design uses responsive HTML/CSS markup that adapts seamlessly to both desktop and mobile browsers, you may not require a separate mobile cache.
How to Enable Device Detection on Your Application
Enabling Device Detection on Cloudways is a straightforward process. Follow these steps to get started:
Log in to your Cloudways Platform using your credentials.
From the top menu bar, open Servers.
Then, choose the server where your desired application is deployed.
Next, click www.
Choose your application.
Under Application Management, select Application Settings.
Navigate to the General tab.
Enable Device Detection.
You will be prompted to confirm this selection; thus, click Confirm to enable the Device Detection.
That’s it! You have successfully enabled the Device Detection feature; your application will now start receiving a new header to understand the device as per below:
Header for | Header name |
Device | $_SERVER[‘HTTP_X_DEVICE_TYPE’] |
Caching an Application with Device Detection
Just like our default caching setup, Cloudways ensures that your website is optimized for performance. All your websites running at Cloudways are cached by default using Varnish. If Varnish is active and you enable Device Detection, the system automatically configures Varnish to create separate cache buckets for different device types. This ensures that your website's content is cached and served according to the specific device accessing it.
Implementing Device Detection in your application is a powerful way to deliver a tailored user experience. Whether you're optimizing for mobile users, enhancing your site's performance, or gathering valuable analytics, this feature empowers you to make data-driven decisions.
To begin using Device Detection effectively, explore the possibilities it offers based on your unique business needs. Adapt your website's design, content, and functionality to cater to the diverse range of devices your visitors use.
Remember, every detail counts when it comes to optimizing your website's performance and user experience. With Device Detection, you have a valuable tool at your disposal to take your web hosting and optimization efforts to the next level.
How to Implement Device Detection
To harness the power of Device Detection in your application, you'll need to set up the appropriate configurations. Below, we outline the steps and provide code examples to get you started.
In most applications, you will find a variety of plugins to extend the Device Detection feature’s functionality. To test the functionality and show how you can easily make the most out of it, we will quickly build a PHP script:
<html>
<body>
<?php
$DEVICE_TYPE = getenv('HTTP_X_DEVICE_TYPE');
echo 'Device : '.$DEVICE_TYPE.'<br>';
?>
</body>
</html>
You can copy the above code in a file and put it on your server to check if everything is working fine. For this example, we have deployed a new PHP application on the Cloudways server and modified the login.php to include the above code. Upon enabling the Device Detection feature and visiting our testing website, we can see that our server can tell us our device.
Important
Cloudways does not endorse any plugins as these may conflict with your current website code and functionality, so use any plugin with extra care. Ideally, if your website is already live, you should test these plugins by creating a staging environment.
Make sure you clear your varnish cache while testing, as it might trick you into thinking no changes are made.
Device Detection is a valuable addition to your web hosting toolkit. By leveraging this feature, you can gain insights into your visitors' devices, optimize your website's performance, and provide tailored experiences that keep your audience engaged.
That’s it! We hope this article was helpful. If you need any help, then feel free to search your query on Cloudways Support Center or contact us via chat (Need a Hand > Send us a Message). Alternatively, you can also create a support ticket.