Combine CSS and JavaScript files

[mouakter13]

Between your WordPress theme and your plugins, your site will likely load multiple CSS stylesheets and JavaScript files, which translates to multiple HTTP requests just for the browser to download the CSS and JavaScript it needs to render the page.

To reduce all these separate requests, you can combine these separate files/stylesheets into a single file/stylesheet. This is called file merging or file concatenation , depending on the tool you are using.

Many WordPress caching plugins include features for combining CSS and JavaScript files. For example, WP Rocket, which you can use at Kinsta, lets you enable both with a few clicks.

Go to the File Optimization tab in WP Rocket settings. Then, enable minification and then merge the files:

How to combine CSS and JavaScript in WP Rocket
How to combine CSS and JavaScript in WP Rocket
For more detailed information, read our complete guide to chile phone number data WP Rocket .

You can also use Autoptimize to combine CSS and JavaScript files. To combine files, go to Settings → Autoptimize and choose options for:

Add JS files
Add CSS files
For more detailed information, check out our complete Autoptimize tutorial .

The benefits of file combining are less clear with HTTP/2 , which is what your site uses if you’re hosted at Kinsta . HTTP/2 is designed to be more efficient at transferring multiple small files, meaning there’s less of a difference between one large CSS/JS file and multiple small files.