Drupal performance optimization is apparently a very complex and tricky thing. To address 100% of the potential in-depth knowledge about many things is needed. On the other hand our experience has shown, that you can very easily address around 80% of the optimization potential by 3-4 very simple measures:
1. Activate standard features caching, compression and aggregation (10-25%)
2. Optimize images (5-40%)
3. Install and configure the ADVAGG module (-10%)
4. If you have slow server response times: Change the hosting company (5-25%)
In brackets you see the potential improvement to be achieved for both mobile and desktop. Pragmatically we used the Google page speed test too to provide these indications. The large bandwidth of optimization is because of very different input variables from website to website: Type of website, quality of coding, configurations/optimizations done already, hosting environment, etc. etc. In our experience you can easily achieve a value between 80% and 90% for Desktop and a value between 70% and 80% for Mobile (Google page speed test) with these measures only.
Step 1: Activate standard features caching, compression and aggregation (10-25%)
Drupal comes along with the standard features caching, compression and aggregation. Once you put a website live, enable these features under admin/config/development/performance. The following configuration of the caching might be optimal for many websites. If you want to fine-tune the caching configuration to the needs of your website, please consult the Drupal documentation.
Minimum cache lifetime: 30min
Expiration of cahched pages: 1day
Step 2: Optimize images (5-40%)
If your website is image rich, this is the biggest potential. Some basic principles to follow to minimize image sizes:
- As a principle, only upload images in the maximum size they will be displayed over all the cases
- Convert non-transparent images to JPGs
- Save JPGs with a reduced quality; usually 85% provides almost the same quality for the eye. Often you may be able to go down to 40-60% (especially for large and thus heavy images with an overlay, typically used for sliders and separators)
- Use image styles to provide smaller versions of an image where appropriate, a very typical case being teasers of nodes
Step 3: Install and configure the ADVAGG module (-10%)
The Drupal module Advanced CSS/JS Aggregation, short AdvAgg, is the holy grail of CSS & JS aggregation and optimization. If you want your website to load faster, install this module. Typically the use of the following sub-modules makes sense (see image). Already the standard configuration will slightly optimize the speed (-5%). Typically you can make the following changes to get more out of it:
- Enable inline and file compression under CSS compression and JS compression. Important note: This might occasionally break some functions. If so, find out which compression does and disable it. Optimally you furthermore find out the critical css or js file(s) of the problematic function . Then you can exclude these critical css/js-files from compression under „per file setting“ and re-enable the affected compression.
- Move JS to the footer: This might break functions too. If so, go back to the default setting by disabling this option.
Step 4: If you have slow server response times: Change the hosting company (5-25%)
Using the Google page speed test or other tools you will quickly find-out whether you have a slow server response time or whether the response time is very bumpy. If so, consider to change your hosting company, since this obviously tremendously affects the performance of your website. One second server response time means a second waiting for the end-user. End-users are very sensitive to this. Thats why it plays also a important role in Google search ranking!
- Log in to post comments