This article lists a few tips that can help you improve the performance of the Discount Ninja script in your store:
How we optimize for performance
We take performance very seriously at Discount Ninja. We understand good performance leads to a positive user experience and increased potential for conversion. We also understand performance scores help with Google ranking. Our team of engineers continuously strives to improve performance where possible.
Discount Ninja requires CSS (styling) and JavaScript (logic) to provide discount functionality. Both the CSS and JavaScript have been heavily optimized to avoid impact on your site and optimize performance:
CSS is loaded asynchronously from Shopify's CDN and is cached by the browser.
CSS is minified to minimize the impact on bandwidth.
JavaScript is minified and served Gzipped to minimize the impact on bandwidth, it is also cached by the browser.
JavaScript loads asynchronously, which means your page renders first. This further reduces the impact of the script on the perceived load speed of your site.
Tools such as Shopify's speed score and Google PageSpeed Insights may mark (part of) Discount Ninja's assets as "unused JavaScript / CSS". During an automated speed test, only a portion of the logic of the app will be used which leads some tools to believe that the script is partially unused. This is incorrect.
Tip 1: set script mode to "Asset mode"
Discount Ninja supports two script modes: tag and asset mode. They represent different mechanisms to include and load the Discount Ninja script on your store. This setting is by far the most important setting with regards to performance.
There are some key differences between the two script modes you should be aware of before switching:
| Tag | Asset | App Embed |
Script load time | Slow | Fast | Fast |
Uninstall | Automatic | Manual | Automatic |
Updates | Automatic | Manual | Automatic |
App Embed and Asset mode is typically faster because it allows the Discount Ninja script to load first (after your page has rendered). This ensures the app isn't waiting for other apps that may be blocking the browser or executing slowly.
However, in asset mode, you'll need to manually remove the script from your theme if you ever need to uninstall the app. If you uninstall the app via the Settings > Subscription > Cancel plan button, the app will automatically do this for you.
The script mode can be configured from the menu in the app.
Go to Settings > Assets > Install script & assets in the Discount Ninja menu.
Next, select the script mode:
Tip 2: set up Dynamic Pricing for product collections
Discount Ninja needs metadata about the products in your collections to evaluate discount eligibility and calculate discounted prices.
To optimize for performance, please ensure all data tags are available in the HTML of your collection products. This requires the setup of Dynamic Pricing as documented here. You can request support from our team in the app. Go to Settings > Dynamic Pricing > Installation to request support.
This is especially important if collections contain a large set of products or if your collection pages use an "infinity scroll" feature.
Tip 3: limit the number of promotions / offers
Discount Ninja is designed to handle and combine multiple promotions and offers. For best performance, it is advised to limit the number of active promotions to the minimum you require.
Adding a large set (50+ active offers) may result in:
A delay after saving settings in the app during which promotions are processed and saved to our cache for performance optimization purposes. This may cause significant delays when testing. If offers reference a large number of products or collections this may further increase delays.
Delays in loading promotions when browsing on your shop.
Tip 4: lock the checkout button while loading
If despite the above tips Discount Ninja does not load fast on your cart page it is possible that some customers manage to click the "checkout" button before the app has applied the promotions to the cart. When this happens the customer will be redirected to a non-discounted checkout.
To avoid this, you can configure the app to disable the checkout button while the promotions are being applied. To avoid any issues the app automatically releases the checkout button after the configured amount of time has passed, even in the unlikely event that the script of the app fails to load.
This feature is configured in the app under Settings > Checkout options in the "Loading effects" tab:
