Home Forums Pure Theme Discussion & Support Tuning for Performance

This topic is: not a support question

This topic contains 6 replies, has 2 voices, and was last updated by  Larry McMahon 5 years ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #2122

    Larry McMahon
    Participant

    Hi,

    Cany anyone share experience using gtmetrix.com to tune a website using this theme?

    I see the demo is rated C, D with a 1.2 MB Total Page Size.

    My BP bare bones test site rates a C, B with a 400KB page size.

    Regards,
    Larry

    #2125

    themeweaver
    Keymaster
    Post count: 730

    One easy hit is to use a WordPress caching plugin. gtmetrix gives some advice on using one.

    This or other plugins can compress css and javascripts.

    Of course with a big slider you’ll also be using big images!

    Tunning a site there are lots of things you “could do”. In the end gtmetrix just gives you some statistics. But you have to way up whether you need to. Is your current set up noticeably slow? What are you prepared to sacrifice?

    There are lots of different tools for measuring this stuff too. gtmetrix will says my page loads in 3s on another it loads in less 1s.

    #2175

    Larry McMahon
    Participant

    Hi,

    There are lots of tools, you may be using a different tool to tune the theme. I look at the time to load delta from tweak to tweak. However, the size of the page download is critical for those users with a slower connection speed.

    My intention for this topic is to get some tips from people on what they have done to tune things up. There seems to be room for tweaking.

    Please take a closer look as gtmetrix provides more that statistics, it provides specific suggestions for what to tune and lists the files that need tuning. For example it lists the images that it thinks have not been optimized and the JS files that could be be combined to load faster.

    I will implement WP Total Cache to improve performance, but that is not a tuneup for the theme or the website. It is the last step.

    IMHO, this tool give theme developers and website implementers a lot of specific suggestions on how to improve performace.

    Larry

    #2176

    Larry McMahon
    Participant

    Hi,

    I just purchase Xi, as ti seems to be more what I was looking for.

    But it has similar opportunities:

    There are 9 JavaScript files served from 50mpg.org. They should be combined into as few files as possible. •http://50mpg.org/wp-content/themes/LivingOS_Xi/base/lib/js/jquery.flexslider.js?ver=3.2.1
    •http://50mpg.org/wp-content/themes/LivingOS_Xi/js/hoverIntent.js?ver=1
    •http://50mpg.org/wp-content/themes/LivingOS_Xi/js/jquery.localscroll-1.2.7-min.js?ver=1
    •http://50mpg.org/wp-content/themes/LivingOS_Xi/js/jquery.scrollTo-1.4.2-min.js?ver=1
    •http://50mpg.org/wp-content/themes/LivingOS_Xi/js/superfish.js?ver=1
    •http://50mpg.org/wp-content/themes/LivingOS_Xi/js/supersubs.js?ver=1
    •http://50mpg.org/wp-content/themes/LivingOS_Xi/js/tricks.js?ver=1
    •http://50mpg.org/wp-includes/js/jquery/jquery.js?ver=1.6.1
    •http://50mpg.org/wp-includes/js/l10n.js?ver=20101110

    Optimizing the following images could reduce their size by 136.6KiB (39% reduction). •Losslessly compressing http://50mpg.org/wp-content/themes/LivingOS_Xi/images/bg/bg10.png could save 112.6KiB (46% reduction). See optimized version.
    •Losslessly compressing http://50mpg.org/wp-content/uploads/2011/11/psi2.png could save 5.9KiB (16% reduction). See optimized version.
    •Losslessly compressing http://50mpg.org/wp-content/uploads/2011/11/psi21.png could save 5.9KiB (16% reduction). See optimized version.
    •Losslessly compressing http://50mpg.org/wp-content/themes/LivingOS_Xi/images/logos/livingos80.png could save 4.9KiB (53% reduction). See optimized version.
    •Losslessly compressing http://50mpg.org/wp-content/uploads/2011/11/DSC002231.jpg could save 4.5KiB (30% reduction). See optimized version.
    •Losslessly compressing http://50mpg.org/wp-content/themes/LivingOS_Xi/base/lib/images/slider_nav_dir.png could save 942B (32% reduction). See optimized version.
    •Losslessly compressing http://50mpg.org/wp-content/themes/LivingOS_Xi/base/lib/images/trans40.png could save 845B (89% reduction). See optimized version.
    •Losslessly compressing http://50mpg.org/wp-content/themes/LivingOS_Xi/base/lib/images/bg_control_nav.png could save 625B (35% reduction). See optimized version.
    •Losslessly compressing http://50mpg.org/wp-content/themes/LivingOS_Xi/images/transparent.png could save 250B (70% reduction). See optimized version.
    •Losslessly compressing http://50mpg.org/wp-content/themes/LivingOS_Xi/images/search_16.png could save 83B (24% reduction). See optimized version.

    There are 7 CSS files served from 50mpg.org. They should be combined into as few files as possible. •http://50mpg.org/wp-content/themes/LivingOS_Xi-child/style.css
    •http://50mpg.org/wp-content/themes/LivingOS_Xi/base/css/reset.css
    •http://50mpg.org/wp-content/themes/LivingOS_Xi/base/css/responsive.css
    •http://50mpg.org/wp-content/themes/LivingOS_Xi/base/css/superfish.css
    •http://50mpg.org/wp-content/themes/LivingOS_Xi/base/lib/css/flexslider.css
    •http://50mpg.org/wp-content/themes/LivingOS_Xi/extend/layouts/responsive-1.css
    •http://50mpg.org/wp-content/themes/LivingOS_Xi/style.css

    Larry

    #2177

    themeweaver
    Keymaster
    Post count: 730

    Yes, some of the plugins I mentioned are suggested as steps by gtmetrix.

    With regards the theme it is provided with uncompress/unminified css and js. There are also separate js and ccs files loaded for different features. For example we only load all the BuddyPress css and js if selected in theme options. You can also remove different features of the theme using the remove_support function in a chide theme (e.g. share buttons).

    If you were really after performance you would combine and minify all these css and js components (just the ones you are using), but people usually want to read the code and do some editing as you also have been doing. And so the theme comes unoptimized in this sense. It is a compromise.

    And that’s why there are plugins (and W3 Total Cache may be one of them) some of which will actually minify/compress css and js from your theme and all your plugins (another factor in all this).

    One thing the theme does do, is to load all the js in the footer (as opposed to header). this means the user gets the content before all the libraries. Not all plugins/themes do that.

    I don’t think these plugins are necessarily a “last resort”. If you are expecting traffic use a caching plugin. It makes a huge difference to your site if your server is just serving cached html and not executing php code. Another one I have used recently is QuickCache.

    If you really do have high traffic and global users, the other thing you can do is use a CDN (content delivery network) to serve your media, css, and js from the cloud. There are services and plugins around to help you do this.

    Another small thing – there is also a plugin called Use Google Libraries that will load the core jQuery that WP (and our themes) uses from Google. This can improve performance since users will very likely already have the library loaded in their browser cache when they visit your site.

    There are lots of things you could do to improve site performance. But I guarantee the biggest hit is to use a caching plugin. But make sure you are logged out when you test it, otherwise it isn’t cached.

    #2178

    themeweaver
    Keymaster
    Post count: 730

    Must have posted that last one about the same time as you. The analysis on Xi – its all about the minification of css and js. As suggested above, if you really want to do this you need to use a plugin.

    Image compression – well again it is about compromise – looks vs speed.

    #2183

    Larry McMahon
    Participant

    Hi,

    WP Total Cache is more like a “last step” after doing what can be done to speed up things. While I develop & tweak, the caching plugin just gets in the way.

    I think there is such a thing as lossless image compression for web images.

    I have a long list of plugins to add to this site, so tuning is very important. This theme is starting off with a large download compared to other BP themes I’m used to, but they are not responsive themes.

    I will look into the USe Google Libraries plugin. Thanks for the tip

    Larry

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.