{"id":1057,"date":"2017-10-07T10:25:38","date_gmt":"2017-10-07T07:25:38","guid":{"rendered":"https:\/\/community.virtono.com\/?p=1057"},"modified":"2020-06-10T16:48:05","modified_gmt":"2020-06-10T13:48:05","slug":"increasing-pagespeed-score-of-your-website-by-changing-nginx-configuration-on-ubuntu-16-04","status":"publish","type":"post","link":"https:\/\/www.virtono.com\/community\/tutorial-how-to\/increasing-pagespeed-score-of-your-website-by-changing-nginx-configuration-on-ubuntu-16-04\/","title":{"rendered":"Increasing PageSpeed Score of your website by changing Nginx Configuration on Ubuntu 16.04"},"content":{"rendered":"<p><span style=\"font-weight: 400\">A web page usually seems to be working fast but the default Nginx configuration will cause Google&#8217;s PageSpeed Insights tool to state inefficiencies in your site and grade the site poorly. PageSpeed Insights are used to measure the performance of a page for a desktop and mobile devices. It fetches the URL two times, once with a mobile user-agent, and the second time with a desktop user-agent. PageSpeed Insights checks if a page has applied best\u00a0<\/span><a href=\"https:\/\/developers.google.com\/speed\/docs\/insights\/rules\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400\">common performance practices<\/span><\/a><span style=\"font-weight: 400\">\u00a0and then provides a score, that ranges from 0 to 100 points.<\/span><\/p>\n<p><span style=\"font-weight: 400\">Therefore, in order to make your site seem more efficient we will make edits to the Nginx configuration file for our domain that instantly boost our site&#8217;s response speed and its PageSpeed metric increases to above 80\/100 so that google will mark it as a fast working site. Since Google uses the speed of our site as a main factor in determining our site&#8217;s search position, hence we will work to increase it\u2019s score.<\/span><\/p>\n<p><b>Before getting started:<\/b><\/p>\n<p><span style=\"font-weight: 400\">Make sure you have the following:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Ubuntu 16.04 server set up<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Server should include a sudo non-root user<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">A firewall<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Nginx installed on your server.<\/span><\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<ol>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Obtain PageSpeed Score<\/span><\/li>\n<\/ol>\n<p><span style=\"font-weight: 400\">Get your site\u2019s PageSpeed score before we get started, so that we can compare it at the end after changing the configurations.<\/span><\/p>\n<p><span style=\"font-weight: 400\">To obtain PageSpeed score paste the site\u2019s URL into\u00a0<\/span><a href=\"https:\/\/developers.google.com\/speed\/pagespeed\/insights\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400\">Google\u2019s PageSpeed Insights<\/span><\/a><span style=\"font-weight: 400\">\u00a0service and then clicking\u00a0on <\/span><b>Run Insights<\/b><span style=\"font-weight: 400\">.<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400\">Now let&#8217;s start by configuring Nginx so that the responses are compressed.<\/span><\/p>\n<p>&nbsp;<\/p>\n<ol>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\"> Gzip Compression<\/span><\/li>\n<\/ol>\n<p><span style=\"font-weight: 400\">When a user opens a site, he has to download a large amount of data containing images and the effects we use via CSS and JavaScript. In order to reduce this time needed to download these we can compress these assets so that they are reduced in size to a more compact version which is comparatively smaller but still contains all the data required. For this compression on Nginx Gzip is one option. Using this compression static assets can be downloaded quicker.<\/span><\/p>\n<p><span style=\"font-weight: 400\">For this, open the Nginx configuration file for your site in a text editor. We will use the default file in example:<\/span><\/p>\n<p><span style=\"font-weight: 400\">sudo nano \/etc\/nginx\/sites-available\/default<\/span><\/p>\n<p><span style=\"font-weight: 400\">Locate the server configuration block. <\/span><span style=\"font-weight: 400\">First, we enable Gzip compression and set the compression level:<\/span><\/p>\n<p><span style=\"font-weight: 400\">server {<\/span><\/p>\n<p><span style=\"font-weight: 400\">listen 80 default_server;<\/span><\/p>\n<p><span style=\"font-weight: 400\">listen [::]:80 default_server;<\/span><\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400\">gzip on;<\/span><\/p>\n<p><span style=\"font-weight: 400\">gzip_comp_level \u00a0\u00a0\u00a0X;<\/span><\/p>\n<p><span style=\"font-weight: 400\">Replace\u00a0<\/span><b>X<\/b><span style=\"font-weight: 400\">\u00a0with a number between 1 and 9.<\/span><\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400\">Make sure not to compress anything that&#8217;s already small and is not needed to shrink much further. The default is\u00a0<\/span><span style=\"font-weight: 400\">20<\/span><span style=\"font-weight: 400\">\u00a0bytes, which is not good as it usually leads to larger files after compression. So, set it up to\u00a0<\/span><span style=\"font-weight: 400\">256<\/span><span style=\"font-weight: 400\">\u00a0instead:<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0gzip_comp_level \u00a0\u00a0\u00a05;<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0gzip_min_length \u00a0\u00a0\u00a0256;<\/span><\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400\">Now, compress data even for clients that are connecting to us through proxies like\u00a0<\/span><a href=\"https:\/\/aws.amazon.com\/cloudfront\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400\">CloudFront<\/span><\/a><span style=\"font-weight: 400\">:<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0gzip_min_length \u00a0\u00a0\u00a0256;<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0gzip_proxied \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0any;<\/span><\/p>\n<p><span style=\"font-weight: 400\">Now set these proxies to cache both the compressed and regular version of the resource whenever the client&#8217;s\u00a0<\/span><b>Accept-Encoding<\/b><span style=\"font-weight: 400\">\u00a0capabilities header varies<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0gzip_proxied \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0any;<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0gzip_vary \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0on; <\/span><\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400\">At last mention the MIME-types for the output you want to compress. In the example will compress images, JSON data, fonts, javascript and other common file types:<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0ip_vary \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0on;<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0gzip_types<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/atom+xml<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/javascript<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/json<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/ld+json<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/manifest+json<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/rss+xml<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/vnd.geo+json<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/vnd.ms-fontobject<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/x-font-ttf<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/x-web-app-manifest+json<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/xhtml+xml<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/xml<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0font\/opentype<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0image\/bmp<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0image\/svg+xml<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0image\/x-icon<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/cache-manifest<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/css<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/plain<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/vcard<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/vnd.rim.location.xloc<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/vtt<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/x-component<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/x-cross-domain-policy;<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0# text\/html is always compressed by gzip module<\/span><\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400\">After specifying the MIME-types, the whole section will look like the following example:<\/span><\/p>\n<p><b>server<\/b><span style=\"font-weight: 400\"> {<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0<\/span><b>listen<\/b><span style=\"font-weight: 400\"> 80 default_server;<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0<\/span><b>listen<\/b><span style=\"font-weight: 400\"> [::]:80 default_server;<\/span><\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0<\/span><b>gzip<\/b> <b>on<\/b><span style=\"font-weight: 400\">;<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0<\/span><b>gzip_comp_level<\/b><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a05;<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0<\/span><b>gzip_min_length<\/b><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0256;<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0<\/span><b>gzip_proxied<\/b><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0any;<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0<\/span><b>gzip_vary<\/b><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/span><b>on<\/b><span style=\"font-weight: 400\">;<\/span><\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0<\/span><b>gzip_types<\/b><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/atom+xml<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/javascript<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/json<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/ld+json<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/manifest+json<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/rss+xml<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/vnd.geo+json<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/vnd.ms-fontobject<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/x-font-ttf<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/x-web-app-manifest+json<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/xhtml+xml<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/xml<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0font\/opentype<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0image\/bmp<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0image\/svg+xml<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0image\/x-icon<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/cache-manifest<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/css<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/plain<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/vcard<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/vnd.rim.location.xloc<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/vtt<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/x-component<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/x-cross-domain-policy;<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0# text\/html is always compressed by gzip module<\/span><\/p>\n<p><span style=\"font-weight: 400\">}<\/span><\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400\">Now, save and close the file.<\/span><\/p>\n<p><span style=\"font-weight: 400\">To ensure that the file has no errors till this point, test the Nginx configuration:<\/span><\/p>\n<p><span style=\"font-weight: 400\">sudo nginx -t<\/span><\/p>\n<p><span style=\"font-weight: 400\">If the changes are made correctly and you made no mistakes, you will get no error messages.<\/span><\/p>\n<ol>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Browser Caching Configuration<\/span><\/li>\n<\/ol>\n<p><span style=\"font-weight: 400\">Google\u2019s PageSpeed Insights recommends that caching is enabled because when you visit a site for the first time, few files are downloaded automatically and stored in the browser\u2019s cache This is done so that the next time you visit the same site, these files will not be needed to be downloaded again.<\/span><\/p>\n<p><span style=\"font-weight: 400\">Open the default Nginx configuration file in text editor:<\/span><\/p>\n<p><span style=\"font-weight: 400\">sudo nano \/etc\/nginx\/sites-available\/default<\/span><\/p>\n<p><span style=\"font-weight: 400\">Now we <\/span><span style=\"font-weight: 400\">will add a small code that will tell browsers to store JavaScript, CSS, images and PDF files in their cache for 7 days period.<\/span><\/p>\n<p><span style=\"font-weight: 400\">Insert the following snippet inside the server block directly after the previous code for Gzip compression:<\/span><\/p>\n<p><span style=\"font-weight: 400\"># text\/html is always compressed by gzip module<\/span><\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400\">location ~* \u00a0\\.(jpg|jpeg|png|gif|ico|css|js|pdf)$ {<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0expires 7d;<\/span><\/p>\n<p><span style=\"font-weight: 400\">}<\/span><\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400\">If the content of your site doesn\u2019t change frequently then cache for 30 days or more as frequent download is not required.<\/span><span style=\"font-weight: 400\"><\/p>\n<p><\/span><\/p>\n<p><span style=\"font-weight: 400\">The is how the configuration of the file will look at last :<\/span><\/p>\n<p><b> \u00a0\u00a0<\/b><\/p>\n<p><b> \u00a0\u00a0\u00a0server<\/b><span style=\"font-weight: 400\"> {<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0<\/span><b>listen<\/b><span style=\"font-weight: 400\"> 80 default_server;<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0<\/span><b>listen<\/b><span style=\"font-weight: 400\"> [::]:80 default_server;<\/span><\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0<\/span><b>gzip<\/b> <b>on<\/b><span style=\"font-weight: 400\">;<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0<\/span><b>gzip_comp_level<\/b><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a05;<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0<\/span><b>gzip_min_length<\/b><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0256;<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0<\/span><b>gzip_proxied<\/b><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0any;<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0<\/span><b>gzip_vary<\/b><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/span><b>on<\/b><span style=\"font-weight: 400\">;<\/span><\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0<\/span><b>gzip_types<\/b><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/atom+xml<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/javascript<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/json<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/ld+json<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/manifest+json<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/rss+xml<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/vnd.geo+json<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/vnd.ms-fontobject<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/x-font-ttf<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/x-web-app-manifest+json<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/xhtml+xml<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0application\/xml<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0font\/opentype<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0image\/bmp<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0image\/svg+xml<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0image\/x-icon<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/cache-manifest<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/css<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/plain<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/vcard<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/vnd.rim.location.xloc<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/vtt<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/x-component<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0text\/x-cross-domain-policy;<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0# text\/html is always compressed by gzip module<\/span><\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0<\/span><b>location<\/b><span style=\"font-weight: 400\"> ~* \u00a0\\.(jpg|jpeg|png|gif|ico|css|js|pdf)$ {<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/span><b>expires<\/b><span style=\"font-weight: 400\"> 7d;<\/span><\/p>\n<p><span style=\"font-weight: 400\"> \u00a0\u00a0\u00a0}<\/span><\/p>\n<p><span style=\"font-weight: 400\">}<\/span><\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400\">Save and close the file to exit. Ensure the configuration has no errors:<\/span><\/p>\n<p><span style=\"font-weight: 400\">sudo nginx -t<\/span><\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400\">Then restart Nginx to apply these new directives for incoming requests.<\/span><\/p>\n<p><span style=\"font-weight: 400\">sudo systemctl restart nginx<\/span><\/p>\n<p><span style=\"font-weight: 400\">Now it is time to check our results.<\/span><\/p>\n<ol>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Comparing the outcome<\/span><\/li>\n<\/ol>\n<p><span style=\"font-weight: 400\">Run your site through the\u00a0<\/span><a href=\"https:\/\/developers.google.com\/speed\/pagespeed\/insights\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400\">Google\u2019s PageSpeed Insights<\/span><\/a><span style=\"font-weight: 400\">\u00a0service once more by pasting the URL and clicking\u00a0Run Insights.<\/span><span style=\"font-weight: 400\"> You will see that \u00a0warnings of compression and browser caching are gone:<\/span><\/p>\n<p><span style=\"font-weight: 400\">Compare the new score against your initial score and you will find drastic changes. Our goal was to have a score above 80. If your site is still below this threshold, there are other things you will need to pay attention to. PageSpeed Insights will help identifying those things and also will provide help to deal with them.<\/span><\/p>\n<p><span style=\"font-weight: 400\">Conclusion<\/span><\/p>\n<p><span style=\"font-weight: 400\">We enabled Gzip compression for specific types of files. Then we configured browser caching for an extra boost. These methods improved the speed of site running on Nginx, regardless of the software it is built with.With the above changes made you will now find that your site works better and loading times has reduced to a lot of extent. This will not only make the users of the site feel satisfied but will also increase search position by Google and hence will help in increasing the ranking of the website. Changing Nginx configuration is just one of the methods of improving your Page speed. To keep things fast you will still need to write performant code, serve assets via a Content Delivery Network (CDN), cache things appropriately and cut back where ever possible.<\/span><\/p>\n","protected":false},"excerpt":{"rendered":"<p>A web page usually seems to be working fast but the default Nginx configuration will cause Google&#8217;s PageSpeed Insights tool to state inefficiencies in your site and grade the site poorly. PageSpeed Insights are used to measure the performance of a page for a desktop and mobile devices. It fetches<\/p>\n","protected":false},"author":4,"featured_media":1058,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[3],"tags":[],"class_list":["post-1057","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tutorial-how-to"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/www.virtono.com\/community\/wp-content\/uploads\/2017\/10\/Nginx-Reverse-proxy.png?fit=1200%2C630&ssl=1","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p7ISfL-h3","jetpack_likes_enabled":true,"jetpack-related-posts":[{"id":517,"url":"https:\/\/www.virtono.com\/community\/tutorial-how-to\/install-nginx-stack-on-centos\/","url_meta":{"origin":1057,"position":0},"title":"INSTALL NGINX STACK ON CENTOS","author":"Daniel Draga","date":"August 25, 2016","format":false,"excerpt":"What is Nginx?\u00a0Nginx is a better free alternative to Apache because its lightweight and RAM-friendly. It can perform better and faster than Apache, particularly when the\u00a0number\u00a0of concurrent site visitors is on the rise. The only downside of Nginx is that not many users familiar with Nginx because it has different\u2026","rel":"","context":"In &quot;Tutorials&quot;","block_context":{"text":"Tutorials","link":"https:\/\/www.virtono.com\/community\/category\/tutorial-how-to\/"},"img":{"alt_text":"1","src":"https:\/\/i0.wp.com\/community.virtono.com\/wp-content\/uploads\/2016\/08\/1-10-300x44.png?resize=350%2C200&ssl=1","width":350,"height":200},"classes":[]},{"id":3195,"url":"https:\/\/www.virtono.com\/community\/tutorial-how-to\/install-elasticsearch-with-kibana-and-logstash-on-ubuntu\/","url_meta":{"origin":1057,"position":1},"title":"Install Elasticsearch with Kibana and Logstash on Ubuntu","author":"George B.","date":"April 9, 2023","format":false,"excerpt":"Elasticsearch is an open-source, distributed search and analytics engine that is designed to handle large amounts of data. It is built on top of the Apache Lucene search engine library and is part of the Elastic Stack (formerly known as the ELK Stack), which includes Kibana and Logstash. It comes\u2026","rel":"","context":"In &quot;Tutorials&quot;","block_context":{"text":"Tutorials","link":"https:\/\/www.virtono.com\/community\/category\/tutorial-how-to\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/www.virtono.com\/community\/wp-content\/uploads\/2023\/04\/How-to-install-Elasticsearch-with-Kibana-and-Logstash-on-Ubuntu.png?fit=600%2C330&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/www.virtono.com\/community\/wp-content\/uploads\/2023\/04\/How-to-install-Elasticsearch-with-Kibana-and-Logstash-on-Ubuntu.png?fit=600%2C330&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/www.virtono.com\/community\/wp-content\/uploads\/2023\/04\/How-to-install-Elasticsearch-with-Kibana-and-Logstash-on-Ubuntu.png?fit=600%2C330&ssl=1&resize=525%2C300 1.5x"},"classes":[]},{"id":3413,"url":"https:\/\/www.virtono.com\/community\/tutorial-how-to\/how-to-install-and-configure-kubernetes-on-ubuntu-22-04\/","url_meta":{"origin":1057,"position":2},"title":"How to install and configure Kubernetes on Ubuntu 22.04","author":"George B.","date":"May 28, 2023","format":false,"excerpt":"Welcome to our comprehensive guide on installing and configuring Kubernetes on Ubuntu 22. In this tutorial, we will walk you through the process of setting up a Kubernetes cluster on your Ubuntu 22 machine. Whether you are a beginner or an experienced user, this guide will provide you with detailed\u2026","rel":"","context":"In &quot;Tutorials&quot;","block_context":{"text":"Tutorials","link":"https:\/\/www.virtono.com\/community\/category\/tutorial-how-to\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/www.virtono.com\/community\/wp-content\/uploads\/2023\/05\/How-to-install-and-configure-Kubernetes-on-Ubuntu-22.04.png?fit=600%2C330&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/www.virtono.com\/community\/wp-content\/uploads\/2023\/05\/How-to-install-and-configure-Kubernetes-on-Ubuntu-22.04.png?fit=600%2C330&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/www.virtono.com\/community\/wp-content\/uploads\/2023\/05\/How-to-install-and-configure-Kubernetes-on-Ubuntu-22.04.png?fit=600%2C330&ssl=1&resize=525%2C300 1.5x"},"classes":[]},{"id":2922,"url":"https:\/\/www.virtono.com\/community\/tutorial-how-to\/how-to-install-nginx-on-ubuntu-20-04\/","url_meta":{"origin":1057,"position":3},"title":"How To Install Nginx on Ubuntu 20.04","author":"George B.","date":"July 29, 2022","format":false,"excerpt":"What is Nginx? Nginx, abbreviated NGI\u0418X, is a web server that also functions as a reverse proxy, load balancer, mail proxy, and HTTP cache. Igor Sysoev created the software, which was made public in 2004. Nginx is free and open-source software distributed under the terms of the 2-clause BSD license.\u2026","rel":"","context":"In &quot;Tutorials&quot;","block_context":{"text":"Tutorials","link":"https:\/\/www.virtono.com\/community\/category\/tutorial-how-to\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/www.virtono.com\/community\/wp-content\/uploads\/2022\/07\/Nginx-Logo.jpeg?fit=1200%2C578&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/www.virtono.com\/community\/wp-content\/uploads\/2022\/07\/Nginx-Logo.jpeg?fit=1200%2C578&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/www.virtono.com\/community\/wp-content\/uploads\/2022\/07\/Nginx-Logo.jpeg?fit=1200%2C578&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/www.virtono.com\/community\/wp-content\/uploads\/2022\/07\/Nginx-Logo.jpeg?fit=1200%2C578&ssl=1&resize=700%2C400 2x, https:\/\/i0.wp.com\/www.virtono.com\/community\/wp-content\/uploads\/2022\/07\/Nginx-Logo.jpeg?fit=1200%2C578&ssl=1&resize=1050%2C600 3x"},"classes":[]},{"id":3626,"url":"https:\/\/www.virtono.com\/community\/tutorial-how-to\/how-to-configure-a-private-docker-registry-in-ubuntu-22-04\/","url_meta":{"origin":1057,"position":4},"title":"How to Configure a Private Docker Registry in Ubuntu 22.04","author":"George B.","date":"June 26, 2023","format":false,"excerpt":"There are situations where you might want to set up your own private Docker registry even though Docker Hub offers a public registry for storing and sharing Docker images. In this guide, we'll show you how to set up a private Docker registry on Ubuntu 22.04 so you can manage\u2026","rel":"","context":"In &quot;Tutorials&quot;","block_context":{"text":"Tutorials","link":"https:\/\/www.virtono.com\/community\/category\/tutorial-how-to\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/www.virtono.com\/community\/wp-content\/uploads\/2023\/06\/How-to-Configure-a-Private-Docker-Registry-in-Ubuntu-22-04.png?fit=600%2C330&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/www.virtono.com\/community\/wp-content\/uploads\/2023\/06\/How-to-Configure-a-Private-Docker-Registry-in-Ubuntu-22-04.png?fit=600%2C330&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/www.virtono.com\/community\/wp-content\/uploads\/2023\/06\/How-to-Configure-a-Private-Docker-Registry-in-Ubuntu-22-04.png?fit=600%2C330&ssl=1&resize=525%2C300 1.5x"},"classes":[]},{"id":3507,"url":"https:\/\/www.virtono.com\/community\/tutorial-how-to\/how-to-install-lemp-stack-linux-nginx-mysql-and-php-on-ubuntu-22-04\/","url_meta":{"origin":1057,"position":5},"title":"How to install LEMP stack (Linux, Nginx, MySQL, and PHP) on Ubuntu 22.04","author":"George B.","date":"June 20, 2023","format":false,"excerpt":"Introduction The LEMP stack is a popular software stack for web development and hosting. It includes four major components: Linux, Nginx, MySQL, and PHP. Each component serves a specific purpose in powering dynamic websites and web applications. Linux is the operating system that serves as the LEMP stack's foundation. In\u2026","rel":"","context":"In &quot;Tutorials&quot;","block_context":{"text":"Tutorials","link":"https:\/\/www.virtono.com\/community\/category\/tutorial-how-to\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/www.virtono.com\/community\/wp-content\/uploads\/2023\/06\/How-to-install-LEMP-stack-Linux-Nginx-MySQL-PHP-on-Ubuntu-22-04.png?fit=600%2C330&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/www.virtono.com\/community\/wp-content\/uploads\/2023\/06\/How-to-install-LEMP-stack-Linux-Nginx-MySQL-PHP-on-Ubuntu-22-04.png?fit=600%2C330&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/www.virtono.com\/community\/wp-content\/uploads\/2023\/06\/How-to-install-LEMP-stack-Linux-Nginx-MySQL-PHP-on-Ubuntu-22-04.png?fit=600%2C330&ssl=1&resize=525%2C300 1.5x"},"classes":[]}],"_links":{"self":[{"href":"https:\/\/www.virtono.com\/community\/wp-json\/wp\/v2\/posts\/1057","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.virtono.com\/community\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.virtono.com\/community\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.virtono.com\/community\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/www.virtono.com\/community\/wp-json\/wp\/v2\/comments?post=1057"}],"version-history":[{"count":1,"href":"https:\/\/www.virtono.com\/community\/wp-json\/wp\/v2\/posts\/1057\/revisions"}],"predecessor-version":[{"id":1059,"href":"https:\/\/www.virtono.com\/community\/wp-json\/wp\/v2\/posts\/1057\/revisions\/1059"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.virtono.com\/community\/wp-json\/wp\/v2\/media\/1058"}],"wp:attachment":[{"href":"https:\/\/www.virtono.com\/community\/wp-json\/wp\/v2\/media?parent=1057"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.virtono.com\/community\/wp-json\/wp\/v2\/categories?post=1057"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.virtono.com\/community\/wp-json\/wp\/v2\/tags?post=1057"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}