Effective Asset Caching for JavaScript, CSS, Images and more

Asset optimization is key to improving your site's performance. To enable asset caching, we need to add configurations to our server software.

For Apache Server

For Apache servers, add the following configuration to your .htaccess file:

<FilesMatch "\.(ico|pdf|jpg|jpeg|png|webp|gif|html|htm|xml|txt|xsl|css)$">
Header set Cache-Control "max-age=31536050"
</FilesMatch>

If you are using Livewire, use the following configuration:

<FilesMatch "^(?!livewire/).*\.(ico|pdf|jpg|jpeg|png|webp|gif|html|htm|xml|txt|xsl|css)$">
Header set Cache-Control "max-age=31536050"
</FilesMatch>

For Nginx Server

For Nginx servers, add the following configuration to your domain's Nginx configuration file:

location ~* \.(ico|pdf|jpg|jpeg|png|webp|gif|html|htm|xml|txt|xsl|css)$ {
    add_header Cache-Control "max-age=31536050";
}

If you are using Livewire, use the following configuration:

location ~* ^/(?!livewire/).*\.(ico|pdf|jpg|jpeg|png|webp|gif|html|htm|xml|txt|xsl|css)$ {
    add_header Cache-Control "max-age=31536050";
}

This configuration will cache the asset files for 1 Year.