The Dynamic Yield script delivers personalized experiences to your site visitors. We are constantly working on reducing the effect the script has on your site's loading time. Here's a list of actions you can take to reduce loading time and flicker even further.
Archive campaigns you don't need
All active variations in all active experiences in all active campaigns are part of the Dynamic Yield script. Do some cleanup every now and then:
- Pause losing variations in A/B tests if the test reached significant results (best practice regardless of script size). If the control won, pause the experience or archive the campaign. Locate A/B tests with conclusive results easily in the dashboard.
- Archive campaigns that are targeted to audiences, pages, and selectors that do not exist anymore. Use the Impressions (Past 7 days) column in the Site Personalization campaign list to identify campaigns that are no longer being served.
- Archive A/A tests that have ended.
Note: Experiences that are targeted to the past are automatically excluded from the script.
Lazy load campaigns
Option 1:
Automatically lazy load all Dynamic Content and Recommendations campaigns that are above the fold. Because the execution part of JavaScript is the expensive one in terms of optimizing the lighthouse score, this feature introduces around 30-40% improvement to your site (depending on the number of campaigns you have).
Contact Support to enable this feature.
Option 2:
Lazy load only select Dynamic Content and Recommendation campaigns. Variation load from the server, with a slight delay (200-500 ms). While this improves your overall site loading speed, it increases the time it takes to load any campaigns that are lazy-loaded.
Contact Support to enable this feature.
Use templates when possible
If you have an experience with 2 variations that are connected to the same template - the code of the template is added once to the Dynamic Yield script, and variations only include the values of the variables. If variations will not be connected to the template, the entire code of both variations is be included in the Dynamic Yield script. More code means more delays, so we recommend using templates whenever possible. Learn more about Templates.
Minify your variation and template code
Minifying the code of the templates and variations can reduce script size significantly. There are various tools online to minify your code (such as minifier.org).
Index products to improve recommendation performance
Larger feeds might experience slower recommendation serving times, although there are many other factors as well, such as the number and types of recommendation rules. If you are concerned or have experienced slow recommendation serving times, we recommend:
- Indexing products using group_id
- Setting is/is not rules instead of contains/do not contain rules when setting up recommendation rules
Add preconnect and prefetch tags
Because Dynamic Yield scripts are served from a different hostname than your website, the browser needs to resolve the DNS. Place a dns-prefetch tag before the script to reduce the DNS resolution time.
Preconnect tags enable the browser to set up early connections before an HTTP request is actually sent to the server. This eliminates roundtrip latency and saves time for users. Some browsers (such as Explorer and Safari iOS) do not support preconnect tags and ignore them.
US data center:
<link rel="preconnect" href="//cdn.dynamicyield.com">
<link rel="preconnect" href="//st.dynamicyield.com">
<link rel="preconnect" href="//rcom.dynamicyield.com">
<link rel="dns-prefetch" href="//cdn.dynamicyield.com">
<link rel="dns-prefetch" href="//st.dynamicyield.com">
<link rel="dns-prefetch" href="//rcom.dynamicyield.com">
<script type="text/javascript" src="//cdn.dynamicyield.com/api/[YOUR SITE ID]/api_dynamic.js"></script>
<script type="text/javascript" src="//cdn.dynamicyield.com/api/[YOUR SITE ID]/api_static.js"></script>
EU data center:
<link rel="preconnect" href="//cdn-eu.dynamicyield.com">
<link rel="preconnect" href="//st-eu.dynamicyield.com">
<link rel="preconnect" href="//rcom-eu.dynamicyield.com">
<link rel="dns-prefetch" href="//cdn-eu.dynamicyield.com">
<link rel="dns-prefetch" href="//st-eu.dynamicyield.com">
<link rel="dns-prefetch" href="//rcom-eu.dynamicyield.com">
<script type="text/javascript" src="//cdn-eu.dynamicyield.com/api/[YOUR SITE ID]/api_dynamic.js"></script>
<script type="text/javascript" src="//cdn-eu.dynamicyield.com/api/[YOUR SITE ID]/api_static.js"></script>
The prefetch code was added to the get code in the platform in early 2019, and the preconnect code was added in November 2019. If you implemented the script before that, chances are that you are not using this method.
Exclude jQuery from the Dynamic Yield script
In the past, the Dynamic Yield script included a jQuery library ($dy) as part of the script. This has a significant impact on the script size.
Since Q2 2019, the $dy library was removed from the script. Because this jQuery library is sometimes used in variations, it was only removed from sites that were created after Q1 2019.
If you created your site before Q1 2019, and you do not use $dy, contact Support to exclude this library from your script.
Advanced: Leverage your own CDN
Dynamic Yield uses a world-leading CDN provider to load its scripts. It is super-fast, and our caching policy is optimized. However, if you experience slowness, it's worth checking the possibility of using your own CDN to load Dynamic Yield’s scripts and host all images that are uploaded to the Dynamic Yield variations. Learn more about CDN integration.
Advanced: Writing to local storage
By default, Dynamic Yield stores data into cookies. If you are using a single-protocol or single-domain site, you can write to the local storage instead of the cookie storage. In order to support this DY.noCookies = true should be placed in the page context as seen in the following example:
<script type="text/javascript">
window.DY = window.DY || {}; DY.recommendationContext = { type: "HOMEPAGE"}; DY.noCookies = true;
</script>Note: If no data is found in the local storage, Dynamic Yield will continue reading cookie data. Moreover, in cases where the browser does not support local storage (for example, incognito mode on Safari), Dynamic Yield will continue to write data to the cookie.
Frequently asked questions
Google PageSpeed Insights Tool flagged the Dynamic Yield cache policy, what should I do?
Nothing. The Dynamic Yield scripts are downloaded on the visitor’s first pageview on the site (causing a minor delay), but the scripts are loaded from the visitor’s browser’s on the next pageviews. Google does not consider this alarming and it is using the same technique for Google Analytics. It’s important to note that:
- Google PageSpeed Insights score does not reflect SEO ranking
- The score does not affect the Google Search crawler
- Google PageSpeed Insights does not measure actual speed, but rather analyzes content and grades webpages according to tagging best practices
- We recommend analyzing your page performance with additional tools (such as Pingdom, Test, and GTmetrix).
Can I use Dynamic Yield without the client script?
Yes. In 2019, Dynamic Yield launched its server-side API. This enables you to use Dynamic Yield core capabilities (behavioral targeting, testing, and recommendations) through the server side. It means there is no flicker and you have full control of the loading time. However, it requires more effort from your developers (like building the variations in your CMS). Learn more about the Dynamic Yield Personalization API.