Adobe Experience Cloud can be a fantastic tool for improving customer experience, but if your page load time is slow, it can be less than adequate. Here's a simple trick that can help reduce page load time and improve the performance of your Adobe Experience Cloud implementation.
We all know that web page load time is essential. The faster your pages load, the more likely people will stick around. According to Google, "50% of users leave a website that takes more than 3 seconds to load." Ouch. But how can you speed up your pages without making too many sacrifices? A straightforward method is preconnect and dns-prefetch to reduce page load times.
What is preconnect for Adobe Experience Cloud?
With preconnect, you will set up early connections before an HTTP request is sent to the server. Connections such as DNS Lookup and TCP handshake are initiated beforehand, eliminating roundtrip latency for those requests and saving time on your end!
What is dns-prefetch?
The dns-prefetch feature enables your browser to efficiently use network resources by connecting certain domains that need lookups before they are requested. This will improve page load times because when a website needs information on one of those addresses, there will be an existing connection in the system pointing at it instead of having another request made.
For best results, the preconnect and DNS-prefetch code should be placed in your header above your tag management script, as shown in the following example:
<!doctype html>
<html lang="en">
<head>
<title>Basic Demo</title>
<!--Preconnect and DNS-Prefetch to improve page load time. REPLACE "techmarketingdemos" WITH YOUR OWN AAM PARTNER ID, TARGET CLIENT CODE, AND ANALYTICS TRACKING SERVER-->
<link rel="preconnect" href="//dpm.demdex.net">
<link rel="preconnect" href="//fast.techmarketingdemos.demdex.net">
<link rel="preconnect" href="//techmarketingdemos.demdex.net">
<link rel="preconnect" href="//cm.everesttech.net">
<link rel="preconnect" href="//techmarketingdemos.tt.omtrdc.net">
<link rel="preconnect" href="//techmarketingdemos.sc.omtrdc.net">
<link rel="dns-prefetch" href="//dpm.demdex.net">
<link rel="dns-prefetch" href="//fast.techmarketingdemos.demdex.net">
<link rel="dns-prefetch" href="//techmarketingdemos.demdex.net">
<link rel="dns-prefetch" href="//cm.everesttech.net">
<link rel="dns-prefetch" href="//techmarketingdemos.tt.omtrdc.net">
<link rel="dns-prefetch" href="//techmarketingdemos.sc.omtrdc.net">
<!--/Preconnect and DNS-Prefetch-->
<!--Data Layer to enable rich data collection and targeting-->
<script>
var digitalData = {
"page": {
"pageInfo" : {
"pageName": "Home"
}
}
};
</script>
<!--/Data Layer-->
<!--jQuery or other helper libraries-->
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<!--/jQuery-->
<!--prehiding snippet for Adobe Target with asynchronous tags deployment-->
<script>
(function(g,b,d,f){(function(a,c,d){if(a){var e=b.createElement("style");e.id=c;e.innerHTML=d;a.appendChild(e)}})(b.getElementsByTagName("head")[0],"at-body-style",d);setTimeout(function(){var a=b.getElementsByTagName("head")[0];if(a){var c=b.getElementById("at-body-style");c&&a.removeChild(c)}},f)})(window,document,"body {opacity: 0 !important}",3E3);
</script>
<!--/prehiding snippet for Adobe Target with asynchronous tags deployment-->
<!--Tags Header Embed Code: REPLACE LINE 39 WITH THE INSTALL CODE FROM YOUR OWN DEVELOPMENT ENVIRONMENT-->
<script src="//assets.adobedtm.com/launch-EN93497c30fdf0424eb678d5f4ffac66dc.min.js" async></script>
<!--/Tags Header Embed Code-->
</head>
<body>
<h1>Tags Basic Demo</h1>
<p>This is a very simple page to demonstrate basic concepts of tags</p>
</body>
</html>
Source: Adobe Experience League - Tags implementation best practices
Site speed is a critical part of the user experience, and it’s something that we are constantly working to improve on our website. If you want to learn more about how to use preconnect and DNS prefetch with your Adobe Experience Cloud implementation, please let us know in the comments below or get in touch with us through our contact forms.
We would be happy to help. Contact us today!