Hot Rod or Clunker? Five Steps to Achieve Top CMS Performance

Even the most impressive website won’t convert visitors into customers if it loads slowly or responds sluggishly to clicks and other interactions. Poor performance is a surefire way to drive visitors off your site.

If high performance is one of your project goals, there is no such thing as premature optimization. Performance should be considered at every step from the very beginning of building your CMS. Changes to your site’s architecture are especially difficult to implement later in the process.

In this article, we’ll look at techniques to build great performance into your website from the start — so you can avoid performance bottlenecks down the line.

Note that this article focuses on best practices for building a high-performance website. We will not discuss performance troubleshooting, which requires a different approach.

Focusing on performance from the early stages of building your CMS pays off. When designing and implementing pages for your site, consider that static pages may make up most of your site’s data traffic. Therefore, design your pages with minimal structural overhead.

Sulu strictly separates structure from presentation, so when optimizing a page template, you can manage the structure (XML) separately from the presentation (Twig/HTML).

When designing your XML structure, aim for simplicity and efficiency. Avoid unnecessary nesting and redundant elements. Use attributes judiciously to keep the structure compact. When working with Twig/HTML, minimize the use of complex logic within templates. Instead, move intensive calculations to the controller or service layer to improve performance and maintainability.

By keeping your page structures lean from the outset, you’re laying a solid foundation for a high-performance website.

Optimizing media files and other assets is a quick win — compressing, minifying, and restructuring assets doesn’t require sophisticated analysis or planning. The steps are well-known and can be automated:

• Resizing and compressing images: Sulu natively supports resizing and re-compressing images.
• Serving responsive images: Small screens, like smartphones, don’t need the same high resolution as 4K desktop screens. You can serve different image sizes using the img tag’s srcset attribute, as described in this Responsive Images Guide. By preparing various image sizes, the browser will select the one that best fits the given screen size.
• Minifying assets: CSS, JavaScript, and other text assets can be minified to reduce file size and transmission time. Minification removes unnecessary elements like comments and whitespace, which are useful for humans but not needed by the browser.

In summary, resizing, compressing, and minifying assets is a straightforward way to save bandwidth. With Sulu’s native optimization support and automation tools, this is an easy win.

Caching is a powerful optimization technique that can be applied at all stages of development and even after a website is in production.

Caches can be implemented at various points between the content’s source and its final rendering on the page. Typically, browsers handle in-memory and on-disk caching to store frequently used assets locally, so for Sulu optimization, the focus is on the server side. Sulu integrates smoothly with popular caching solutions like Symfony HttpCache and Varnish.

We have a complete guide on smart caching with Sulu to help you set up your caches effectively. In essence, Sulu communicates with HTTP caching proxies that buffer frequently accessed static content. The cache solution you choose depends on your use case. Sulu is bundled with Symfony HttpCache, which is a basic solution suitable for small-to-medium sized sites. For larger sites with high traffic, Varnish can be a suitable alternative.

The takeaway: While Symfony HttpCache handles default caching for most sites, if you’re running a large site or expect significant traffic, you should consider switching to Varnish

The database is the heart of every CMS, and keeping it optimized is essential. While database optimization is a vast topic that could fill entire books, we’ll focus on a few key practices. Standard techniques for schema design and database maintenance include creating suitable indexes, writing efficient queries (such as avoiding SELECT *), denormalizing data to improve read throughput, and performing regular cleanups using built-in database tools.

Slow database performance can also be caused by network latency, especially if the database and the Sulu application are on different machines. See if you can keep other traffic out of this part of the network, upgrade to a faster network, or even move the database to the Sulu application server.

If the database is optimized but still struggles with traffic spikes, consider moving it to a faster machine.

These are just a few ways to maximize database performance. The specific measures you take will depend on your situation and requirements.

By now, your system is optimized and running on a powerful server, but when traffic spikes, it may still struggle to keep up. One option is to upgrade to an even more powerful server. However, a smarter solution is horizontal scaling.

Instead of continually upgrading server hardware (and eventually hitting limits that bigger and faster hardware can’t solve), horizontal scaling adds more servers as needed and distributes requests across them. Unlike vertical scaling, horizontal scaling works both ways: when traffic decreases, servers can be shut down to save costs.

Setting up a horizontally scaled system with two or more Sulu servers behind a load-balancing proxy is straightforward: a simple Deployer script might be enough. For more complex requirements like automatic scaling, consider using orchestration tools like Kubernetes, Nomad, or Juju.

Compared to the previous steps, horizontal scaling demands more analysis, planning, and implementation. Review your current setup thoroughly before proceeding, and consult our Scaling On Demand guide.

Sulu is built for speed, but a CMS’s performance also depends on thoughtful analysis and planning. By applying the techniques covered in this article, you can significantly improve your website’s performance with low to moderate effort. Lean page structures, optimized assets, caching, database optimization, and horizontal scaling are strategies that can be applied in isolation or in any combination to speed up your website and delight your visitors.