Optimize Smooth Slider To Avoid The jQuery Library Load In Head Of Your Posts

As most of the bloggers would like the slideshow running on their home pages and may be some other specific pages, and not on their single posts, we thought that it would be good if we have some technique to optimize the Smooth Slider so that it does not load heavy jQuery library and some lines of CSS styles for the Smooth Slider in the header of each of the post. This is because, most of us want our post posts to be light weighted with small size, so that they load fast for those visitors who come from search engines searching something! And also, we do not want the scripts and styles loaded for that application which we are not using on that particular post.

Add the below code in the functions.php that you could find in Appearance => Editor, on the right hand side of your wp-admin panel. Put the code at the end of the file before the closing php tag ?>

remove_action( 'init', 'smooth_slider_enqueue_scripts' );
remove_action('wp_head', 'smooth_slider_css');
if ( $_SERVER['REQUEST_URI'] == "/" ) {
   add_action( 'init', 'smooth_slider_enqueue_scripts' );
   add_action('wp_head', 'smooth_slider_css');
}

The $_SERVER[‘REQUEST_URI’] == “/” indicates that you have to include the script and styles only for the home page. If I had to include it for some other page also whose URI is “http://www.clickonf5.org/smooth-slider” then my code for function.php would be as follows:-

remove_action( 'init', 'smooth_slider_enqueue_scripts' );
remove_action('wp_head', 'smooth_slider_css');
if ( $_SERVER['REQUEST_URI'] == "/"
or   $_SERVER['REQUEST_URI'] == "/smooth-slider") {
   add_action( 'init', 'smooth_slider_enqueue_scripts' );
   add_action('wp_head', 'smooth_slider_css');
}

“/” indicates “http://www.clickonf5.org/”

Thus, by adding the above code, I would get the necessary scripts for Smooth Slider on my index page and on smooth-slider page.

Now you can get a bit choosy where you want to put the optimized slideshow and where not! So don’t think that Smooth Slider plugin would overload your web page’s head section, when not needed.

You can use this simple technique and see how it causes miracles in reducing the post load time.

  • SM

    Tejasvini
    Thanks a lot for a fantastic plugin. I use it in three of my blogs. Appreciate all the great work. I had one request to make in terms of improving the performance of Smooth Slider. Is it possible to minify the javascript in the next version and also maybe not inline JS that it creates on the page and instead leave in the .js file. Inline JS and file based js creates unnecessary contention while rendering.

  • Thus, by adding the above code, I would get the necessary scripts for Smooth Slider on my index page and on smooth-slider page.