Why it is Important???

While it come to speed and performance, many websites fails to achieve it. Due to this there is a huge drop on in their rankings in a various search engines. Not only ranking, the visitors lead also gradually decrease which force the admin to close their masterpiece. But Don’t worry, here we go, in this post I am going to reveal such codes to be placed in various locations that will help you place a decent score in Google Page Speed Insights and directly increasing the growth of your blog and websites.

Note:- You don’t need to be mastered in languages to do so. This is a very simple guide even a non-techy person can do. If you are nervous, then contact a certified web developer to do so for you. Best Android Games.

Do Google Really Consider Page Speed Score to Rank??

The simple answer is Yes, because Page Speed is one of a web app developed by google. Detecting and fixing error by following it can increase your position and rankings in google. This is why My Blog have a decent rank in Google in Just 50 Days!!!  

CONTENT:-

1- Leverage Browser Caching

Caching is the most important factor when it some to site speed. Properly arranging it can help you to get a great speed. The cache expiry date is one of the factor that google consider. Google consider 8 Days as a good expiry period, If you have a good caching plugin but does not mange to solve it in Page Speed then Follow the Steps:-  

For Apache Server (Put the code in .htaccess file)

ExpiresActive On
ExpiresByType image/gif A2592000
ExpiresByType image/jpeg A2592000
ExpiresByType image/jpg A2592000
ExpiresByType image/png A2592000
ExpiresByType image/x-icon A2592000
ExpiresByType text/css A86400
ExpiresByType text/javascript A86400
ExpiresByType application/x-shockwave-flash A2592000
#
<FilesMatch "\.(gif¦jpe?g¦png¦ico¦css¦js¦swf)$">
Header set Cache-Control "public"
</FilesMatch>

For Nginx Servers (/etc/nginx/nginx.conf)

location ~* \.(css|js|ico|gif|jpeg|jpg|webp|png|svg|eot|otf|woff|woff2|ttf|ogg)$ {
expires max;
}

If you have a problem adding the following code in your following configuration files, then you must contact your hosting provider. They will help you to do so…

2-Enable Compression

Compressing files in your website will help you to save bandwidth as well as decreasing the load in your server. A fully compressed site will load faster than an un-compressed website. There are many available plugins that will do it but If you want to do without a help of a plugin then use the following code:-

For Nginx Server

gzip on;
gzip_disable "MSIE [1-6]\.(?!.*SV1)";
gzip_vary on;
gzip_types text/plain text/css text/javascript image/svg+xml image/x-icon application/javascript application/x-javascript;

For Apache Server ( In the .htaccess file)

<IfModule mod_deflate.c>
# Compress HTML, CSS, JavaScript, Text, XML and fonts
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE application/x-font
AddOutputFilterByType DEFLATE application/x-font-opentype
AddOutputFilterByType DEFLATE application/x-font-otf
AddOutputFilterByType DEFLATE application/x-font-truetype
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE font/opentype
AddOutputFilterByType DEFLATE font/otf
AddOutputFilterByType DEFLATE font/ttf
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE image/x-icon
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/xml
</IfModule>

Note:- Before putting the code check whether your server have mod_filter enabled to handle unconditionally using AddOutputFilterByType. If after adding code your website shows an 500 Error, contact your hosting provider. But in most of the cases it is absolutely safe.

3- Minify JS, CSS and HTML

Minifying these resources will help you to increase your website speed. By this process it compress the size of the resources and have advantage for both visitors and admin. It ultimately save the bandwidth and hence the download over server resources decrease. But in many cases, Page Speed can’t find a specific minified data in your website. Here is the code that can help you.

For WordPress Users- Go to Editor> and Find Function.php File> Paste the code there> Click Update File… You are Done!!

<?php
class WP_HTML_Compression
{
// Settings
protected $compress_css = true;
protected $compress_js = true;
protected $info_comment = true;
protected $remove_comments = true;

// Variables
protected $html;
public function __construct($html)
{
if (!empty($html))
{
$this->parseHTML($html);
}
}
public function __toString()
{
return $this->html;
}
protected function bottomComment($raw, $compressed)
{
$raw = strlen($raw);
$compressed = strlen($compressed);

$savings = ($raw-$compressed) / $raw * 100;

$savings = round($savings, 2);

return '<!--HTML compressed, size saved '.$savings.'%. From '.$raw.' bytes, now '.$compressed.' bytes-->';
}
protected function minifyHTML($html)
{
$pattern = '/<(?<script>script).*?<\/script\s*>|<(?<style>style).*?<\/style\s*>|<!(?<comment>--).*?-->|<(?<tag>[\/\w.:-]*)(?:".*?"|\'.*?\'|[^\'">]+)*>|(?<text>((<[^!\/\w.:-])?[^<]*)+)|/si';
preg_match_all($pattern, $html, $matches, PREG_SET_ORDER);
$overriding = false;
$raw_tag = false;
// Variable reused for output
$html = '';
foreach ($matches as $token)
{
$tag = (isset($token['tag'])) ? strtolower($token['tag']) : null;

$content = $token[0];

if (is_null($tag))
{
if ( !empty($token['script']) )
{
$strip = $this->compress_js;
}
else if ( !empty($token['style']) )
{
$strip = $this->compress_css;
}
else if ($content == '<!--wp-html-compression no compression-->')
{
$overriding = !$overriding;

// Don't print the comment
continue;
}
else if ($this->remove_comments)
{
if (!$overriding && $raw_tag != 'textarea')
{
// Remove any HTML comments, except MSIE conditional comments
$content = preg_replace('/<!--(?!\s*(?:\[if [^\]]+]|<!|>))(?:(?!-->).)*-->/s', '', $content);
}
}
}
else
{
if ($tag == 'pre' || $tag == 'textarea')
{
$raw_tag = $tag;
}
else if ($tag == '/pre' || $tag == '/textarea')
{
$raw_tag = false;
}
else
{
if ($raw_tag || $overriding)
{
$strip = false;
}
else
{
$strip = true;

// Remove any empty attributes, except:
// action, alt, content, src
$content = preg_replace('/(\s+)(\w++(?<!\baction|\balt|\bcontent|\bsrc)="")/', '$1', $content);

// Remove any space before the end of self-closing XHTML tags
// JavaScript excluded
$content = str_replace(' />', '/>', $content);
}
}
}

if ($strip)
{
$content = $this->removeWhiteSpace($content);
}

$html .= $content;
}

return $html;
}

public function parseHTML($html)
{
$this->html = $this->minifyHTML($html);

if ($this->info_comment)
{
$this->html .= "\n" . $this->bottomComment($html, $this->html);
}
}

protected function removeWhiteSpace($str)
{
$str = str_replace("\t", ' ', $str);
$str = str_replace("\n", '', $str);
$str = str_replace("\r", '', $str);

while (stristr($str, ' '))
{
$str = str_replace(' ', ' ', $str);
}

return $str;
}
}

function wp_html_compression_finish($html)
{
return new WP_HTML_Compression($html);
}

function wp_html_compression_start()
{
ob_start('wp_html_compression_finish');
}
add_action('get_header', 'wp_html_compression_start');
?>

This following code will help you to compress your website, without any help of a plugin. It may not work if you have not followed the instruction given in the code. If you can’t understand anything, contact a certified web developer. If you get an error after entering this feel to contact me or comment below.

4-Eliminate Render-Blocking JS and CSS in the Fold Content

This is due to some of the blocking CSS and JS  which lead to slow down your website. The render-blocking files prevents another file to be open and hence increase the load time eventually. The above can be fixed by delaying (Delay) of the Javascript and Style Sheets Files. Another process is that to make the request size lower, so that the fold content is visible.

This is a Google Suggested Code which must be placed in the bottom of your </body> tag.

<script type="text/javascript">
function downloadJSAtOnload() {
var element = document.createElement("script");
element.src = "defer.js";
document.body.appendChild(element);
}
if (window.addEventListener)
window.addEventListener("load", downloadJSAtOnload, false);
else if (window.attachEvent)
window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;
</script>

Note:- Make sure you put the code just above the ending</body>tag, so that the code will be able to run.

5- Prioritize Visible Content

This can’t be fixed in any code. If you are looking for some code to do so, there are so many fake codes in the internet, that consist of so many malware that can break down your website. The above problem can be caused by various other problems. Solving them can make you score better in Google Page Speed. Here are some known problems and their fix:-

  • Check your Caching Plugin.
  • Fix the Render Blocking CSS and JS First.
  • Move JS to the Footer.
  • If you want to solve the problem then better ton use AMP.
  • Make Your JS async. A plugin called Async JS can do it or you.

6- Reduce Server Response Time

The Server Response time is totally dependent upon the server performance and your data send to your visitors. The more the number of files send through the server the more the CPU Usage that can gradually decrease the speed. The average response time server is 100-300 Millisecond. Response time over this time period is considered as low server response time. What need to be Fixed:-

  • Combine External JS and CSS files.
  • Lazy Load Images, by Using Jetpack Lazy load or BG Lazy Load.
  • Lower the Number of Requests.
  • Increase your hosting capabilities by upgrading its plan.
  • Limit Post Revisions
  • Use Browser Caching

I use Fast-Comet Web Hosting because they are awesome!! They have a very good and fast support, best plans and super fast servers. To Know more about them Click the Link Below:-

Limit Post Revisions

While creating a post, WordPress save a huge number of revisions in your database. The number of revision must be limited, to reduce the server response time. Below is the code which can do so for you.

Add the Following code in your wp-config.php files which is located in the root of your WordPress directory. Make it over FTP.

define('WP_POST_REVISIONS', 3);

7- Optimize Images

I doesn’t recommend following codes, to do for you. There are many available plugins in the wordpress, which will compress and resize your images. A regular website consists 60% of Images so compression is needed. Here are some plugins that will help you:-

I recommend to use the above two image optimizer only. They really do the job and better than other optimizers.

Note/ Before applying this codes and settings, you must Backup your website and database. A slight mistake can turn big!! Happy Blogging:) From The Tech Hackers.

Categories: SEO and WP

Soubhagya

An interactive Web and App developer, Blogger, SEO Manager Who likes to know more about Technology. He is very connected towards technology and loves his visitors!!! The head of The Tech Hackers whose life motto is “Little by little, day by day, what is mean for you WILL find its way”.

Pin It on Pinterest

Share This

Share this post with your friends!