Skip links

Improve Website Speed – Code & Database Optimization

We have previously written how to improve website speed where we had mentioned 12 tips which can fantastically speed up loading of your website without implementing any code.

Loading speed of a website seriously does matter. Research says 65{136ce94cc7fec1f5657bab0b4d73ed308318c1024f899c463e79e42d4b375fbf} of visitors will abandon a page that takes more than 3 seconds to load. Also years ago Google has announced that it takes page speed into account when ranking websites.

So even after applying the techniques mentioned in that article and getting an amazing speed, we shouldn’t miss more ways to improve the speed of the website. So let’s increase the performance more by uses of code tips described in this article. A basic understanding of PHP, MySQL and FTP client is inevitable from you.

Improve Website Speed with Code – 8 Tips

#1 Use CSS Sprite

Sprites are concatenated images. CSS Sprites are a means of combining multiple images into a single image file to use on a website, to help with performance. Suppose you need to use five social media icon images on a website, you have two choices.

You can use either five single images of 1.5KB each or one image worth 8KB as background and position it just right so that only the one you need is visible. Even the one background image is slightly 0.5KB heavier, several images are loaded with a single HTTP request.

This makes browsers to not deal with or limit multiple concurrent requests. And this reduces the number of HTTP handshakes, requests and responses. You can Google more about CSS sprite and use them with background-position and width/height CSS properties.

#2 Optimize Your Pages

The more elements you would have on your pages, the slower will be site loading. So put only what is worth on your website pages and always try to do more with less! Below are some tips which can greatly improve website speed.

Be Specific to Image: Your homepage and archive pages don’t always need a full size of an image. For example, archive pages just need to display thumbnails in posts list while single pages show a full-sized featured image.

WordPress has many functions to retrieve post image like the_post_thumbnail(). Always specify the size you exactly need rather than let the function render full sized image every time.

Alternatively, a good theme always play fairly with WP image functions to let your website render faster. You can trust at our Boo theme which knows when to utilize what for better site speed.

Replace PHP with Static HTML: PHP is great to avoid entering the same information several times but it also asks for memory and execution time. So replace PHP with static HTML content wherever it’s possible. It increases your blog speed.

For example you can replace <?php bloginfo(‘description’); ?>  to direct description in your theme file. This also limits database calls, an important key to speed up website loading.

Ads and Widget: Limit the number of ads you show on the website. Don’t display irrelevant widgets on every page. Like, sharing widgets are good at single post pages only.

#3 Lazy Load the Content

Lazy Load displays images, videos or iframes only when it comes to visitor’s screen. It helps to improve website speed by not requesting for any content until that portion of the article isn’t scrolled down to reach.

If the caching plugin you’re using doesn’t come with lazy loading feature, you can use one from WordPress plugins repository. Consult our article 5 better lazy loading plugins to choose a good one plugin for you.

Or even You can simply put lazy loading script in your theme’s footer and let it work like magic. Keep reading the ThemeRella blog as we’re going to tell you it soon.

#4 Minify HTML, CSS & JavaScript

Concatenation and minification are key tools to improve website speed. Once your files are final, prepare minified versions of them without comments, spaces, line breaks etc.

There are many tools available to concatenate and minify the source files. Our favorite tool is Gulp and you can also use handy tools from Google like this link & Closure Compiler.

#5 Necessary Script and Right Location

It’s about enqueuing scripts and style only to pages where they are required and in right location or order. For example, the sliders are used mostly at homepages. Unfortunately, we have seen many themes which load slider related styles and scripts to each page no matter a slider is there or not. The similar is true for plugins.

If you want to speed up your WordPress website loading, you need to avoid this mistake. Stylesheeets are always loaded in head section of a website while scripts are put into footer. The wp_enqueue_style(), wp_dequeue_style(), wp_enqueue_script(), wp_dequeue_script() are useful WordPress functions here.

Load JS file in footer by passing fifth parameter to true in wp_enqueue_script() function. You can also remove unused style/script in WordPress through passing handle’s name in first parameter to the wp_dequeue_style() and wp_dequeue_script() functions respectively.

#6 Control HTTP Requests

Decreasing the number of HTTP requests that WordPress makes can make your website loading faster. Every resource that a client’s device asks from the server is an HTTP request. Concatenation of several JS or CSS files into one is the example of limiting HTTP requests.

Your theme & plugins might also request kind of files from external websites like analytics data, styles & scripts from Google, Facebook etc. You can reduce all these external HTTP requests by disabling scripts and styles or merging them into one file.

7# Remove Query Strings from Static Resources

If you have ever tested your website, you must have alerted about removing query strings from static resources to improve the speed of the website. Static resources are those CSS and JS files which are included on the WordPress website but they change rarely.

www.yourdomain.com/wp-content/themes/yourtheme/style.css?ver=4.6

Here “ver” is the query string parameter appended by WordPress and it makes the browsers and servers unable to cache the resource. So by removing them, you can sometimes improve your caching and performance. The caching plugins you use, generally remove the query strings and you can also put the code snippet in your theme’s functions.php to attend the same.

function _remove_script_versioning( $src ){
$parts = explode( '?', $src );
return $parts[0];
}
add_filter( 'script_loader_src', '_remove_script_versioning', 15, 1 );
add_filter( 'style_loader_src', '_remove_script_versioning', 15, 1 );

Keep reading to know about these handy tricks. Here the function above will help you to improve website speed by query string removal.

#8 Use AJAX

With AJAX, your website users can view updated content without loading a new page or reload an existing page. This saves a lot of time on your server by no need to prepare the whole new page. Loading of more posts at the bottom of the website when a visitor reaches there is an example of AJAX and the server doesn’t need to prepare the menu or slider. Right? You have gotten it!

In WordPress, AJAX is implemented through jQuery in the browser and admin-ajax.php, residing on the server. This is a broad topic to discuss but implementing AJAX can heavily decreasing site loading time and an additional benefit of providing the rich user experience.


#9 Turn Off Pingbacks and Trackbacks

While it doesn’t require coding, we included it because we missed it in the previous article about the same improve WordPress website speed topic. Every time another blog mentions you, it notifies your site, which in turn updates data on your post.

Turning these pingbacks and trackbacks off will not destroy the backlinks to your site, just the setting that generates a lot of work for your site, is turned off. Just go to Settings -> Discussion and uncheck these two options in default article settings:

— Attempt to notify any blogs linked to from the article
— Allow link notifications from other blogs (pingbacks and trackbacks) on new articles


3 Tips to Improve Website Speed with Database Optimization

#10 Clean the Database

With over time, your database gets loaded with information which is just garbage for you. This consists of post revisions, spam comments, shortcodes, trash and many more. Get rid out of all these unnecessary information for an improved performance.

You can temporarily use wp-optimize or wp-sweep plugins for that or can remove using MySQL queries if you have good expertise. Just take a database backup before whatever you do.

Also, you should have a good understanding of how does WordPress work and its standards. It will help you to write optimized queries and decrease database requests.

#11 Limit Post Revisions

Open your wp-config.php and put these two lines below there:

define('WP_POST_REVISIONS', 3);
define('AUTOSAVE_INTERVAL', 300); // seconds

WordPress keeps revisions for each article automatically. The first constant instructs WordPress to save only last 3 revisions of each post and discard older. The second constant allows WordPress to update revisions with 300 seconds interval rather than the default of 60 seconds.

#12 Remove Database Level Overhead

It’s the thing that no other thing can do except the MySQL itself. Use a built-in tool in MySQL called “Table Optimization” to remove database level overhead. It is very much like disk defragmentation for hard drives. Doing so will rearrange your database files to let it perform in the best way.

Instruct the Engine to Improve Website Speed

Till here, we’ve discussed a lot of things to improve WordPress website speed and performance. Don’t miss the last part, we’re going to tell you there about instructing your server engine to load the website in minimum time.

Opinions

  1. Post comment

    Hi! I’ve been following your weblog for a while now
    and finally got the bravery to go ahead and give you a shout out from Porter Tx!
    Just wanted to say keep up the good job!

    Permalink

Join the Discussion

Return to top of page