Website performance has been playing a crucial role in defining User Experience and User Retention, and it has now become even more critical with Google’s ranking algorithm, attributing greater importance to the website speed.  Blazing fast websites amplify user acquisition, engagement, and retention which results in higher conversion rates.

It is recommended to implement performance best practices well in advance, as one builds a website. Working on performance tuning after it becomes a concern might be too late, as it would have already affected user acquisition and retention. Here are certain key factors to consider while building websites on Sitecore:

CACHING

• Tune Sitecore Caches
• Item Cache
• Data Cache
• Prefetch Cache
• HTML Cache
• AccessResult Cache
• Custom Cache (based on Sitecore.Caching.CustomCache)

Under Load Test, the cache size of Sitecore Caches must be 70-80% allocated, but within the RAM capacity. Initial Values for Cache Tuning Procedure can be referred in Sitecore Documentation (https://doc.sitecore.com/developers/93/platform-administration-and-architecture/en/recommended-initial-cache-values.html)

• Enable HTML Cache for Components with appropriate Vary By Option
• Customize default HTML Caching to cache components under Personalization, A/B Testing and by Cookie etc. as needed. This will assist in storing and serving all the variations of a component from HTML Cache, enhancing the performance
• Segregate feasible heavy logics into async calls to enable HTML Caching
• Enable Browser Caching for Static files in IIS with proper expiration
• Avoid Inline Styles and Scripts as it could affect Performance as well as SEO
• Configure CDN for Media Items
• Utilizing CDN for HTML will obviously limit Sitecore Capabilities including Personalization, A/B Testing, Analytics, Marketing Automation etc. and alternative solutions need to be defined and implemented before caching HTML Markup only when it is absolutely necessary
• A complete analysis of all the capabilities available in the opted CDN needs to be performed to ensure maximum performance benefit. Certain CDNs provide options to store different variations of Pages.

RESOURCES

• Use Async/Defer attributes for scripts
• Optimize the order of scripts/styles to avoid render blocking
• Create two bundled scripts – Deferred and Nondeferred, grouping the scripts into two different bundles will help to defer the load of certain scripts that can be executed after page load
• Use Resource Hints like DNS Prefetch, Preconnect, Preload etc. for external domains
• It is recommended to use DNS Prefetch for external resources that are leveraging browser cache
• Preconnect (with DNS Prefetch as fallback, since few browsers lack preconnect support) is preferred for external domains that do not leverage browser cache
• Fonts, background images, etc. which are specified in CSS could be rendered as Preload links. This will ensure that the fonts, background images etc. are downloaded before css is downloaded and parsed, enhancing performance and user experience
• Swap Fonts with System Fonts using ‘font-display: swap’ or ‘display=swap’for displaying content to user early using system fonts before custom fonts are downloaded
• Render Scaled Images for different devices, which will help in saving few bytes for mobile users resulting in an improved performance
• Render optimized images with tools like Dianoga etc. for lossless compression
• Remove unused CSS with online tools
• Minimize request size by reducing the URL length, cookies etc, if feasible
• Specify image dimensions with width and height parameters, this improves the page load time by ensuring that the browsers are not waiting for the image to download to find the dimensions of the image, allowing the page to be laid out with appropriate space for the image before the image is downloaded
• Lazy Load Images, which improves page load time, especially when there are more images that will need users to scroll down for viewing them and also when images are available within tabs, accordions etc.
• Use progressive JPEGs instead of baseline JPEGs
• Use image formats like JPEG2000, WebP etc.
• Compression techniques like GZip and Brotli
• Ensure JSS/CSS are bundled and minified with proper Bundling and Minification tools

SEARCH

• Ensure effective usage of supported search platform (SOLR/Azure/Coveo)
• Leverage Search Platform where source is expected to grow more
• Create Custom Indexes while using search slatform for website functionalities
• Optimize indexes by indexing only required fields
• Configure appropriate source location for indexes
• Utilize Master/Slave configuration for SOLR
• Leverage replicas in Azure Search with Load Balancer
• Use Sitecore Query/Fast Query only when needed
• Limit the usage of GetDescendants and GetAncestors as it could affect performance-based on the number of total descendants/ancestors

INFRASTRUCTURE

• Route Web Traffic through CDN Network by pointing Domains to CDN’s Name Servers, which will reduce the DNS Lookup Time
• Configure TTL as 24 hours for A Record and CNAME, as they do not change often. Ensure to bring down the TTL before making any change to the DNS Records to ensure that they are not cached at client.
• Ensure appropriate Vertical Scaling on the basis of utilization of different roles
• Add more servers to scale horizontally for the required roles with Load Balancer based on the load
• Sitecore Licence terms must be reviewed before making any scaling operations. Perpetual Licence will have limits and Sitecore Representative must be contacted.
• Opt Data Centers based on the geography of users
• Ensure servers are able to accommodate projected number of users and sessions
• Address all the exceptions by frequently analyzing Logs
• Use SSD for Database Servers

The following approach will be helpful when troubleshooting performance issues:

• Perform Load Tests with jMeter, Gatling, Blazemeter etc.
• Leverage Sitecore Debug Tool
• Use Profiling Tools like dotTrace, Dynatrace etc.
• Use Real User Monitoring with Monitoring tools like Pingdom, Site24x7 etc. to find Real User Performance(RUM) and issues
• Analyze recommendations from Google Lighthouse, GTMetrix etc.
• Leverage Windows Performance Monitor
• Utilize WebPageTest for conducting advanced performance tests based on connections, devices, locations etc.
• Leverage Network Tab of the browser for quick insights
• Use Sitecore LogAnalyzer
• Optimizing critical parameters such as:
• First Contentful Paint
• First Meaningful Paint
• Speed Index
• First CPU Idle
• Time to Interactive

Improving website performance is essential for keeping the customers happy and driving business growth. Adhering to the performance best practices will help with blazing fast sites on Sitecore!

On- Demand Webinar

Sitecore Cognitive Commerce - Transforming the future of ecommerce

Ragister Now

Subramanian Ramanathan Technical Architect

• Em