Page load performance matters, and it's essential that websites are fast because the speed directly impacts business metrics like User Experience (UX), conversions and ranking in search engines. And most importantly, fast site speeds make users happy.
A recent evaluation by HTTP Archive shows just how efficiently TYPO3 performs compared to other content management systems (CMS) - TYPO3 scores fastest in First Contentful Paint (FCP) timing. How is this good site performance achieved? Let’s first take a look at some technical aspects and then at the vibrant network of professionals who make their living building TYPO3 web applications.
Paint Timing API is a performance-orientated API metric that can be used to capture a series of key moments during browser rendering. The Paint Timing API provides information about when the browser starts to “paint” (also called “render”) something on the screen and defines two different UX metrics: First Paint and First Contentful Paint. Both metrics mark different points after a user’s navigation and help evaluate how quickly or slowly a page starts to display after browser navigation.
First Paint & First Contentful Paint
First Paint (FP) is triggered after a user taps a button and any render (e.g. change in background color) is detected by the browser. It measures the point at which a browser renders pixels to the screen and something visually different is displayed. FP gives answer to the question “Is something happening?” and is therefore reassuring for site visitors.
First Contentful Paint (FCP) refers to the timing when any content (e.g. text, image, SVG) is displayed on the screen. It measures how quickly or slowly a website visitor sees the first response from a page, starting when the user taps a button and starts navigation until the first content appears on the screen and the user can start reading or consuming content. FPC gives users answer to the question “Is the content useful for me?”
Web performance has a strong impact on User Experience (UX) and can inspire confidence and trust in your brand. Slow page load significantly affects the quality of end-user experience and is one of the main reasons why users leave a site.
Increased page load time of more than 3 seconds can lead to more than 50 % of users leaving a site. In contrast, reduced page load time influences the way users perceives a site, helps meet their expectations and can lead to positive revenues.
HTTP Archive is an open source project that provides data on how digital content is structured and served. In September 2018, HTTP Archive published the First Contentful Paint (FCP) scores of 24 popular content management systems, including Drupal, WordPress, Contao, and TYPO3.
The report analyzes performance metrics of a web page loading and the diagram is compelling because it shows how the User Experience varies by CMS. With almost 45% of fast loading sites, TYPO3 is ahead of every other CMS in the analysis.
What the Google Chrome UX graph also shows is that:
Less than 10% of Wix sites achieved a fast ranking.
Less than 25% of the WordPress sites measured were able to earn a fast ranking.
Just over 35% of the Drupal sites achieved a fast ranking.
That’s a huge performance difference between e.g. Wix and TYPO3 - 8.57% versus 44.82%.
HTTP Archive offers other loading speed reports such as DOMContentLoaded (the time until a browser fully loads a HTML page, without other resources like CSS stylesheets or images necessarily being completely loaded yet) and Time to Interactive (TTI, the number of seconds from the time the user navigation starts until a page is fully interactive).
For more information on how the HTTP Archive works read their guide on how to explore the data. If you’re curious about your site’s performance, use a service like GTmetrix to generate a First Contentful Paint timing and analyze the speed.
1. Speed gains with PHP 7+ series
In the field of page speed, one of the fundamentals for good site performance is that the software you’re using is built with a scripting language that is well suited to modern web development. PHP is the most widely used programming language on the web today and is the code behind popular content management systems like TYPO3, WordPress, Joomla, Drupal, and Magento. It’s an open source server-side scripting language and is highly influenced by C, C++ and Java.
With the release of PHP 7 in 2016 came great site performance gains, it’s a huge improvement in comparison with its predecessors. PHP 7 makes your site faster. Much faster. Take a look at the image at the bottom of this page on zend.com - it shows just how fast PHP 7 is in comparison to other scripting languages like Ruby, Perl and Python - namely approximately 10 times faster! All current PHP versions are generally fully supported and patched regularly for security vulnerabilities; at the time of this writing that’s PHP 7.1, PHP 7.2 and the third feature update of the series, PHP 7.3, which was released on December 6, 2018.
TYPO3 runs on newest PHP versions
TYPO3 is written in PHP. The two currently supported stable TYPO3 versions are TYPO3 v8 LTS and TYPO3 v9 LTS. TYPO3 v8 LTS requires PHP 7.0 or higher and the newest version, TYPO3 v9 LTS, will run on nothing lower than PHP 7.2. The TYPO3 core team has also already adopted TYPO3 v9 LTS to the newest PHP version 7.3 - check the official TYPO3 requirements for more details.
2. Performance boost with caching
A good caching strategy reduces the number of database operations and code compilation. TYPO3 comes with an efficient caching framework that supports multiple layers of caching. Each cache can be configured separately and can be used to execute complex storage strategies. You can store all caches to a specific network server with cache systems, e.g. the Redis key-value store. This can be run in a cluster, so it‘s scalable and therefore faster.
3. Fine-tuning by configuration
TYPO3 supports numerous ways to optimize page load speed and make a website highly performant. Advanced TYPO3 performance features include:
Automatically scale and resize large images, which reduces the size of data.
Of course applying other general system configurations to increase the overall performance of any website is beneficial too. Common settings include:
Avoid unnecessary redirects
Every redirect causes the browser to initiate two requests instead of just one. Chained redirects slow down the impression of the user significantly, before the requested page or content comes up.
Use a Content Delivery Network
By using a Content Delivery Network (CDN) like CloudFlare or Amazon CloudFront, “objects” like static assets (e.g. images, CSS files, etc.), but also pages and documents can be stored on decentralized servers across the world. If a user accesses the URL of the TYPO3 site, resources are delivered from the geographically nearest server, rather than the original server, which reduces loading times.
Enable HTTP/2 support
The primary goal of HTTP/2 is to make applications faster.
4. Large, complex sites require technical expertise for set up
TYPO3 is built to handle large multisite solutions with advanced features and a wide range of content in many different languages. You can run a practically unlimited number of websites from a single installation. The CMS therefore serves well as a solution for large organizations, educational institutions and other businesses that typically require a complex architecture. Due to the size and complexity of such web applications, the task of setting a TYPO3 site up is a challenging one that requires both time and multilayered technical expertise.
A well configured TYPO3 site can be highly performant and scale well to high traffic. Conversely - just like any other misconfigured product or setup - a poorly optimized TYPO3 instance can be frustratingly slow for its users.
Achieving good site performance is not a question of getting THE right tool in place. Managing site performance requires a mix of code optimization, configuration, server tuning, a fast and performant scripting language (like PHP), a caching strategy that is optimized for the specific use case and access pattern of the site, and most importantly of all: professionals, who provide top-notch web development services.
A skilled system administrator knows how to balance a TYPO3 system for specific purposes and optimized performance. TYPO3 professionals know how to set up systems and networks correctly and they know what hardware and servers will give the best speed and prevent bottlenecks in system performance.
What the performance graph shows is that TYPO3 professionals know their trade and can develop complex sites which achieve above average site performance.
The TYPO3 agency market is very strong. Maybe you‘re considering rolling out a new website and migrating from a different software solution to TYPO3? Or are you updating or relaunching an existing TYPO3 website? TYPO3 GmbH can support you in finding a qualified development partner.
We work closely together with a network of professional service providers who offer a broad array of services like website development, maintenance, and ongoing support services. To ensure a high level of quality, our partners employ certified professionals with advanced skills. Their partner profiles on our site showcase expertise and provide details on recent projects for you to browse.
Web performance is an essential quality for a good content management solution. Multiple aspects and features together contribute to a website’s performance, and all components of a setup should be taken into consideration. A fast scripting language like PHP and a good caching strategy are two of many important aspects that add to the performance of your website.
Our TYPO3 Partner Program will help you find the quality and performance you need for your specific needs. Members of this program have proven both their expertise as well as their participation in the TYPO3 project.
Do you have questions about TYPO3 CMS or our TYPO3 Partner Program? Do get in touch, our team would love to hear from you.
Thanks to Oliver Hader for contribution and feedback.