How to Speed Up Umbraco CMS performance (edit)

What to do with a slow Umbraco CMS website?

There is a lot of tutorials and resources about ways to optimize and speed up Umbraco CMS. However, it can be confusing trying to find everything you need in one place.

That's why I am going to share with you everything I know about boosting Umbraco CMS!

Over many years of experience and hard lessons learned – we have all in one place.

If you have anything to do with Umbraco CMS or Content Management Systems in general, you should find something useful in this post!

In this article we’re going to cover the following improvements:

• Better user experience
• Faster website speed & performance
• Reducing resources usage (CPU / Memory / IO)
• Elimination of unnecessary external requests
• Reducing network traffic
• Save money with lower cost of maintenance
• Getting stable application without memory leaks

Why should you speed up Umbraco CMS website?

Website speed is a hot topic these days.

In general, if your website isn’t fast enough - your business is losing money!

Simple as that.

Ok, speaking about numbers:

• 52% of people consider page load speed as a crucial element for building customer loyalty
• 47% of people want a page to load in 2 seconds or less
• 40% will leave your website if it takes longer than 3 seconds to load
• For every 100 millisecond increase in page load speed, Amazon’s revenue went up by 1%

How inefficient website can impact your business?

In most cases, a website is the primary channel in which a company connects with their customers and audience. Each downtime or other problem related to the site - your business is missing opportunities and losing lucrative leads.

Moreover, the list of consequences is very long – so let's pick some of the most important ones:

• Brand damage. Slow website looks non-professional and outdated and create an overall negative user experience. To be honest - users are pissed off and brand reputation is damaged.
• First impression. As we all know - the first impression is the most important – so initial page load time is crucial here.
• Website downtime can turn potential customers away and affect existing ones.
• Search engines rank. All top search engines (Google, Bing, Yahoo, AOL, Ask) like websites with fast-loading times and rank them higher than the slow ones. So, if you want to improve your position in - improving speed should be on the top of your backlog.
• Studies have shown that site-loading speed of more than 2 seconds usually results in about 47 percent of visitors leaving the website. So, to keep about half of your website visitors - you should speed up your Umbraco website.
• Trust and security. Online buyers are the most impatient ones - they expect the page to load in split second. They want to place an order quickly and efficiently. Tn this case, website problems are unacceptable and the entire order process must be simple and reliable. Customers must trust your platform because they leave money there. That’s why, if you are running an e-commerce store on Umbraco CMS - then you better get ready to make major improvements - so your business can be more profitable and make conversions.

Before optimization test current speed & performance

There are many impressive tools that can boost Umbraco website, the following work really well:

• GTmetrix
• Pingdom Website Speed Test
• PageSpeed Insights
• Web Page Test
• Google Chrome Audit

Apply Umbraco CMS good practices / Set key components 

• Published content should be strongly typed and accessible through strongly typed properties
• All published content models should be placed in dedicated folder which relates to built in model builder namespace, personally I prefer folder names like [ContentModels]
• Property aliases should be derived automatically from generated model
• Each string aliases should be replaced by strongly typed property names from generated models.
• Upgrade CMS Umbraco and related Components if possible – each new version comes with new features, bugfixes and better user experience. Check Umbraco Releases page - where you can compare the differences between versions and monitor breaking changes
• Use Filesystem provider for all media items to be in s3 - UmbracoFileSystemProviders.Azure is a great package to check
• Use Examine for searching if possible
• Use best and recommended plugins / extensions

Use C# Language/ MVC / .NET Framework Best Practices

• Use best coding standards / formatting style
• The name of the solution and all projects should be related to the brand / project.
• Pick fast enough dependency resolver slow one can cause performance issues, you can find popular IOC frameworks comparison here: IoC Battle
• Too many solutions projects & dependencies could be an overkill.
• Source code should easy to expand and maintain
• Refactor the Code from time to time
• Make Code Reviews and use gitflow to ensure better code quality and delivery
• Apply proper Design Patterns

Frontend improvements

• Use clean and minimal homepage design
• Ensure website is Mobile Friendly and renders well on a variety of devices
• Images should be properly compressed and optimized.
• Enable GZIP compression to reduce transfer size
• Specify a Last-Modified or ETag header to enable cache validation
• Automatic compression should be enabled for all HTML sites code
• Upgrade TypeScript to newest version.
• Take advantage of minification for html, css, javascript, WebMarkupMin is a great tool to reduce HTML, XHTML and XML and remove whitespaces
• Bundle assets - CSS, HTML, JavaScript, consider splitting them into groups, it can be easily done with ClientDependency package.
• Set Proper and recommended by Google caching response headers for images
• Fix console Errors and bad requests
• Use Lazy Loading for Images, Videos and external widgets like Disqus. One of the best plugins out there is jQuery Lazy
• Use a Content Delivery Network (CDN)
• Make ajax call asynchronous and cacheable
• Parsing html takes time, so reduce number of DOM elements
• Don’t overkill the site with huge JavaScript – rendering can take some time and it can affect user experience
• Eliminate render blocking CSS & JS code
• Serve scaled & compressed images – check if images can be optimized in html or css
• Defer parsing JavaScript to reduce blocking of page rendering
• Leverage browser caching for the css, js cacheable resources
• Optimize the order of styles and scripts
• Remove unused code
• Ensure CSS files are downloaded in parallel, always include external CSS before external JavaScript
• Specify image dimensions
• Avoid bad requests
• Avoid landing page redirects
• Enable Keep-Alive
• Put CSS in the document head
• Combine images using CSS sprites
• Avoid CSS @import
• Prefer asynchronous resources
• Specify a character set early (content)
• Avoid a character set in the meta tag (Content)
• Specify a Vary: Accept-Encoding header (Server)

Backend improvements

• Set logger log level as high as possible – do not log everything – enable tracing only for discovering big issues. Remember to disable tracing on production websites.
• Use Examine for searching content, media and users. Examine uses Lucene index engine is recommended and it’s real fast.
• Avoid Hosting Videos on Your Own Site. Use external providers like Vimeo or Youtube
• Reduce number of http requests – (deserialization takes time & network traffic is expensive)
• Dispose unmanaged resources properly. Make sure that file streams, database connections are released. This is most common mistake I see every time during code review - usually committed by novice programmers. In many cases it causes memory leaks, increased memory usage and overall instability of the application.
• Build application in Release mode and make sure that debug=”true” flag is not set in web.config

Pick the right caching strategies

• Partial Views should be cached.
• Use Cached Partial
• Use Macro with caching.
• Proper headers decrease number of total requests generated by users when loading page multiple times.
• Replace ASP.NET session state caching with Redis – move state out of in process
• Use ASP.NET Output Caching
• Consider Donut Output Caching by DevTrends
• Use Redis Output Caching
• Enable GZIP Compression
• Configure ETags
• Add expires or Cache-Control Header
• Consider using read only database as caching layer

Keep your Umbraco database sharp

The database is often the bottleneck of the entire system - in most cases Umbraco uses MSSQL.

• Use tools like – SQL Profiler to find bottlenecks and heavy queries, optimize them in the first place
• Perform regular database maintenance. Clean tables once in a while if possible. Old revisions are first on the list.
• Create indexes for faster queries, but do it wisely
• Check index fragmentation level and rebuild them from time to time
• Stay up to date with the latest version of your database engine
• Consider tables data fragmentation for better indexing & faster queries
• Check for ghost transactions
• Avoid storing database files on system partition if database is self hosted
• Plan the right amount of disk space if database is self hosted
• Database server should be strong enough (resources like CPU, RAM, HDD)
• Choose the right disk storage - SSD disks can significantly improve your overall database performance
• Find any I/O bottlenecks and fix them

Analyse External integrations

• Use tools like Fiddler to identify all requests - both inbound and outbound
• Eliminate unnecessary requests
• Reduce external API calls and cache them if it’s possible
• Store data that rarely changes in cache

Choose a fast and reliable Umbraco hosting provider

Hosting can have a big impact on your overall Umbraco CMS website performance.

Picking the right one may be confusing, however, below are some popular options:

• Azure Cloud - https://azure.microsoft.com
• Amazon Cloud - https://aws.amazon.com
• Umbraco cloud - https://umbraco.com/umbraco-cloud-pricing/
• eUKhost - https://www.eukhost.com/

Picking a specific platform, you should consider factors like:

• Uptime
• Pricing
• Configuration difficulty
• SSL Certificates
• Management panel usability
• Customer support & response time
• Overall Features list
• Processing power, RAM
• Disk type – SSD is preferred

I personally prefer Azure Web App with an Azure SQL database. It’s working great with media and blob storage. Besides, Microsoft offers proven support.

Final words

Once you implemented these solutions, you’ll hopefully see a noticeable improvement in site speed and page load times.

Refer: https://gosudev.com/blog/software-development/umbraco-cms/how-to-speed-up-umbraco-cms-performance/

Refer: https://mlichtenberg.wordpress.com/2011/09/19/catching-unhandled-exceptions-in-asp-net/

Refer: https://weblogs.asp.net/imranbaloch/monitoring-asp-net-mvc-application

Refer: https://stackify.com/aspnet-mvc-error-handling/

Samples:

https://github.com/mlichtenberg/UnhandledExceptionWebApp

https://github.com/mlichtenberg/ASPNetTwitterFeedControl