Rendering Issues on Page Load

This is not typical to Soliloquy Carousel, but is rather typical of what is known as a FOUC (flash of unstyled content). FOUCs are caused by issues with the loading performance of the site.

I ran your url through the GTMetrix pagespeed tool which provided the following result: http://gtmetrix.com/reports/studio154.it/u8yqXwdO

There are a number of issues which could be implemented to improve the performance, this in turn will allow Soliloquy to perform better as well.

The recommendation to serve scaled images is a large factor in the page performance. You may wish to inspect the slider when it is displayed on the largest browser you support and change the Slider Dimensions under the Config tab to match those dimensions.

Following this, you can enable the height and width parameters on the image tags under the Config tab when editing your slider, which resolves the “Specify image dimensions” recommendation for slider images. You’ll want to add image dimensions to all other images used on the site as well – specifying a width and height for all images allows for faster rendering by eliminating the need for unnecessary reflows and repaints.

Use a plugin like EWWW Image Optimizer to losslessly compress images.

To address the Expires Headers, Browser Caching and GZIP Compression recommendations, open the .htaccess file in the root directory of your WordPress installation and add the following:

## BEGIN Disable ETags ##
Header unset ETag
FileETag None
## END Disable ETags

## BEGIN GZIP Compression ##
<ifModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file .(html?|txt|css|js|php|pl)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_exclude mime ^image/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</ifModule>
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
## END GZIP Compression ##

## EXPIRES CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg “access 1 year”
ExpiresByType image/jpeg “access 1 year”
ExpiresByType image/gif “access 1 year”
ExpiresByType image/png “access 1 year”
ExpiresByType text/css “access 1 month”
ExpiresByType application/pdf “access 1 month”
ExpiresByType text/x-javascript “access 1 month”
ExpiresByType application/x-shockwave-flash “access 1 month”
ExpiresByType image/x-icon “access 1 year”
ExpiresDefault “access 7 days”
</IfModule>
## EXPIRES CACHING ##

You can try setting all JavaScript to defer by adding the following to your theme’s functions.php file

//* Defer parsing of JavaScripts
function defer_parsing_of_js ( $url ) {
if ( FALSE === strpos( $url, ‘.js’ ) ) return $url;
if ( strpos( $url, ‘jquery.js’ ) ) return $url;
return “$url’ defer “;
}
add_filter( ‘clean_url’, ‘defer_parsing_of_js’, 11, 1 );

Please note that defering all JavaScript may interfere with some plugins, and you’ll want to test thoroughly your site’s front-end appearance after including. If it breaks a plugin just remove from your functions.php file.

You can remove query strings from JS and CSS files by adding the following to your theme’s functions.php file: https://gist.github.com/ericakfranz/a7f172fd63aaf01ede4c. There is a free WP plugin that can do this for you automatically

Minifying the CSS for the site is recommended. Plugins like BWP Minify or Autoptimize are an easy way to implement this. If you choose to enable JavaScript minify, be sure to thoroughly check the functionality of your site as this can break JavaScript dependent plugins. If this breaks a plugin you can simply disable the JavaScript minification.

Once you’ve made these changes you can re-test the url at GTMetrix to check the improvement.

• This reply was modified 9 years, 3 months ago by akyusa01.

Hi @andyt 🙂

I’m unable to access the link anymore, is there another link I should be viewing?