TYPO3 Speed & Performance - Essential Extensions!

For all the benefits TYPO3 CMS brings, out of the box speed isn’t one of the biggest selling points. Luckily, there are a number of TYPO3 optimization Extensions and related tasks you can do to improve TYPO3 site performance to  — including installing the right TYPO3 Speed performance extensions.

The speed and performance of your TYPO3 website play a major role in your brand reputation.

Do you know?

Google cares about how quickly your website renders. It’s as simple as that. Load times are consistently rated a top SEO factor by experts and something Google has built a suite of tools around to help us measure and improve.

Paying attention to the speed and performance of your TYPO3 website with simple win tasks and extensions, you can accomplish is improving the performance of your TYPO3 site.

Below you’ll learn why a fast loading TYPO3 website is a must, and about the most useful and best TYPO3 performance extensions that are worth installing on your site.

Maybe you have Googled “TYPO3 Performance Tips & Tricks”? No? Here is the ultimate TYPO3 performance guide that you can’t afford to miss!

Solid loading time is anything under 2 seconds. Of course, the lower you can get this number the better. The site in the image above is pretty good, but there are a few tweaks that could push that up to an A grade.

Yet another reason we are going over the best TYPO3 performance extensions for you!

There are numerous factors that will impact the performance of your TYPO3 website. 

If you check your website with the speed test websites stated above, at that point you likely have a good list of improvements suggested to make.

Almost all of the TYPO3 speed and performance extensions suggested in the blog will fix most of these issues for you. 

But before we hop into the list of extensions, you'll need to fix any of the basic fundamental execution issues. 

Here are the absolute most noteworthy factors that will add to the poor performance of your website:

• Your web host 

You need a reliant TYPO3 web host that can support the size of your website and existing traffic levels. Moreover, it needs to be configured properly and run quality server hardware and software to help you get the most out of your site.

• Your template quality 

Your TYPO3 template should be lightweight, speedy, and ideally pretty minimal. Heavy templates lead to slower sites and put you at a disadvantage when it comes to optimizing your website.

• Size of your site

Large sites can load quickly, but they need to be paired with the right kind of hosting plans. Plus, additional optimization steps need to be taken to reduce the overall size of your site. Opting for solutions like TYPO3 SaaS can lead to improved performance and security of your website.

• Choice of Extensions 

Extensions should only be installed for must-have features. If you have too many stacked, inactive, or non-updated extensions, this can really slow down your site.

This extension tells Varnish about TYPO3 insights of a page to allow Varnish to make proper caching decisions based on that information. Furthermore, it informs Varnish to invalidate its cache as soon as a content is changed through the TYPO3 backend. Some of its features are,

• Ready to use configuration for Varnish and TYPO3
• Varnish based caching for all cacheable pages
• TYPO3 clear cache hook to clear cache for appropriate pages in Varnish too

This TYPO3 extension adds the required bits to use NGINX's fastcgi_cache for TYPO3 pages. It adds appropriate cache control headers, documents the required NGINX configuration, and flushes the Nginx cache when content changes.

Akamai CDN Adapter for TYPO3 allows flushing CDN caches related to a TYPO3 installation. When TYPO3 is behind Akamai's EdgeGrid CDN, this extension is a perfect companion for you. This extension hides the complexity of Akamai's EdgeGrid API to purge caches.

Embracing TYPO3s Caching Framework this extension provides a new cache to track all pages outputted that are cacheable. When an editor changes to content on a page, the page cache needs to be cleared - and the reverse proxy needs to be informed that the cache is invalid. This is usually done via an HTTP PURGE request to the proxy server. The benefits for that are that the editor does not need to worry about why out-of-date information is still visible on his/her website.

#3 Create a WebP copy for images (TYPO3 CMS)

WebP is a modern image format that provides superior lossless and lossy compression for images on the web. Using WebP, webmasters, and web developers can create smaller, richer images that make the web faster. This extension adds automatically created _WebP_ copies of all JPEG and PNG images processed by TYPO3.

The extension optimizes uploaded/processed images with binaries of your choice.

This extension Source Optimization does Optimization of the final page by reformatting the (x)HTML output, removal of new lines, and quotes.

#2 CSS/Javascript Minificator, Compressor, And Concat

This extension minimizes the Http requests by concatenating your CSS and javascript. Furthermore, the result can be minified and compressed. This whole process is highly configurable and is partly based on the "minify", "jsminplus" and "jsmin" projects.

#3 Frontend Performance

This extension helps to improve frontend performance in TYPO3 CMS. It does,

• Minification of JS (files and inline)
• Exclude per page inline JS from the concatenation
• Move default JS to the footer
• Minify all generated HTML

#4 Cache optimizer

This Extension improves the cache clearing process of TYPO3. It uses an enhanced tag handling to clear the cache in these use cases:

When a content element is changed, when a file or the metadata of a file is changed, when a file is changed the directory is detected, and when a record of an Extension is changed.

#5 Faster Backend Page tree

This extension replaces and extends parts of the new page tree component in TYPO3 9. By default, it loads subpage trees up to a configurable nesting level, adding database mounts and deeper subpage trees that have been explicitly opened by the current backend user. This is helpful for large installations with a lot of pages, in which the v9 core component can run into performance issues (server- and client-side).

Extends TYPO3's compressor for JS and CSS with minifier. This may save you up to 70% of default compressed file size. Also compresses HTML output of TYPO3. Full composer support.

• Step 1. Go to Web > Template > Select root-page
• Step 2. Edit Setup > Add following code > Click on Save button

# TypoScript Setup
config.no_cache = 0

#2 Compress and Concatenate Your Assets

Generally, your TYPO3 site may have more than 15+ CSS/JS files. Let's compress and concatenate them in a single file to avoid too many requests.

Step 1. Go to Web > Template > Select root-page

Step 2. Edit setup > Add following code > Click on Save button

# TypoScript Setup
config.compressCss = 1
config.compressJs =1
config.concatenateCss = 1
config.concatenateJs = 1

#3 Use TYPO3 + Varnish (EXT:varnish)

Do you love TYPO3 & Varnish? The varnish is the fastest, most flexible, and cost-efficient web accelerator available for your online business. Andri Steiner developed robust Varnish TYPO3 Extension Varnish Connector.

#4 Avoid JavaScript Block Rendering

Google PageSpeed highly recommends loading your Javascript at the end of the page to avoid JavaScript block rendering and increase first-byte rendering. Just make sure to include your JavaScript libraries with the following TypoScript way.

# TypoScript Setup
config.moveJsFromHeaderToFooter = 1
page.includeJSFooter {
    Jquery = jquery.min.js
    Bootstrap = Bootstrap.min.js
}

If your site's speed and performance has been lagging, then optimizing your TYPO3 site for speed should be your number one priority.

You are not far away from a perfectly loading TYPO3 website, all you have to do is install, activate, and configure your TYPO3 extensions of choice from the list above.

Have you used any of these TYPO3 performance-boosting extensions? Have we missed any extension? Which one is your favorite and why? Let us know in the comments!