Search Results for 'pagespeed'

OMG! That’s realy a lot, esspecialy for me (wordpress rookie)
Question: Is it posible that you help me with this job Cristopher? (what is your rate?)

JBH

@JBH
Hi, looks like setting proper folder permissions on your site really helped to start 🙂

But, looking at your example post page you have a LOT of work to do.

most of your errors have nothing to do with the theme; so you’re going to want to address all that stuff first. Possibly find better solutions for what you’re doing with some of those external systems. Basically you’re loading too many things from external sites, which will lower your scores; more than 5 external things is bad for speed.

For example – this is crazy:
This page has 29 external Javascript scripts. Try combining them into one. This page has 13 external stylesheets. Try combining them into one. This page has 7 external background images. Try combining them with CSS sprites.

Note you can’t do much about the stuff you’re loading from other sites/servers, but you should
1) remove “versioning” — implement the .htaccess (if running Apache) and functions.php suggestions which I’ve posted, especially for the remove of the version tags. If running child theme you may need to put in child version; not sure on that.
2) optimize javascript delivery; use the td speed booster plugin to help with theme resources; but it won’t help with external stuff you’re loading
3) you cant do anything about the image dimensions of the things being loaded off external websites
4) prefer async – you’d have to hack whatever plugin you’re using for Facebook to load that as async
5) optimize images – be sure what you upload is already as small as possible; also use something like smushit or similar; possibly use my functions.php code for setting smaller default compression size for WordPress built in function (e.g., change from default 90 to 6); then do regenerate thumbnails — boom everything 20% smaller!
7) consistent URL errors coming from your “leadpages” stuff
8) vary encoding errors – coming mostly from leadpages
9) redirect issues – whatever you’re doing with Facebook and Google generating errors
10) bad request with favicon

(etc.)

GTmetrix report homepage: http://gtmetrix.com/reports/www.vetvrij.com/Dbmvvg6R
GTmetrix resport post page: http://gtmetrix.com/reports/www.vetvrij.com/Qi2SEDvr

Thank you in advance!

• This reply was modified 11 years by JBH.
• This reply was modified 11 years by JBH.

Please post the link to the GTmetrix report for your page. Also, try testing a post page, NOT the home page.

Hi Christopher,

Thank you! I’m not a pro and need a bit more help for this. Number 2 and 3 are definitely server related (both java script related) how to fix them?

The first ons (image dimensions) is hard becouse i can’t set those demensions by hand) the images are scaled and provided automaticly by the newspaper theme)

Can you please help me a bit.

Thank you!

@JBH
address all the server related issues FIRST (marked “server” in the results table). Then move on to the next things.

3.6 to 4 is simple; follow the manual upgrade option
https://forum.tagdiv.com/how-to-update-the-theme/

Be sure to update the plugins found in the themeforest “all items” download for the theme, in the plugins folder after theme files updated.

be sure to

First make BACKUP of your dbase, and any special files you’ve modified; turn off all caching, clear caches, clear cache on CDN if using one; turn off mod_pagespeed if using it.

1) switch to main theme, NOT the child theme if using one
2) turn off all plugins while doing update
upload theme files via FTP
3) turn on ONLY the plugins included with theme after upgrade of both theme and plugins
4) if sidebars disappear you can usually just go to appearance and resave them and then back
5) turn on any “extra” plugins

Hope that helps! 🙂

Great topic, very usefull tips!

This are my gtmetrix results, any suggestions to get better results? especialy at the first 6 lines.

Thanks!

@Steven pretty much said what I had on my mind in very diplomatic way.

@cherry = Seems it might make sense to try to optimize your server/CDN/ etc. with the default theme for WordPress while you’re learning how to do this, then switch to the big theme once you have your foundation set in stone, as it were. There are many many sites out there which detail how to optimize a WordPress site, server, caching, CDN, PageSpeed, etc. – before you even get to the theme features.

Hi! @manuel
The mod_pagespeed system runs at the server level as an nginx or apache module (we use apache as main system, with nginx used for some other things on same box, but not for WP sites). So, it runs above the domains, but re-writes content on the fly and then caches stuff and works with the server-based caching.

Benefits include automatic blank space removal, comment removal (e.g., “SEO powered by Yoast SEO” and other stuff you don’t want to “advertise” to the world, etc.) rewrite of image dimensions for anything resized to “fit” and cached version of the new size image, optimization of images, conversion of gif to png where necessary, DNS pre-fetch, etc., etc. — but you can read about it on the Google site.

We’re used the self-hosted module (aka “GPS” https://developers.google.com/speed/pagespeed/module ), but they also have a service to host content (aka “PSS” https://developers.google.com/speed/pagespeed/service ), which is a mix of CDN and the pagespeed modules together and you can test the before/after speed on their site to see if it benefits you (remember you have to do test couple of times for it to cache stuff). Test: http://www.webpagetest.org/compare

@christophersimmons:
what you understand by “graphics loading from the network portal vs localized”? As far as I know where isn’t any CDN in Germany thus we decided to server pictures from nginx ram with having in mind that this should be faster or at least comparable to cloudfront.

Fonts and Google Analytics are loaded from Google, I think this is a preset from the theme.
jQuery and Co are loaded from public CDN. I think this is faster than serving them myself since they already should be precached.

In addition to this the only thing loaded from external servers are ads and content tests. The content tests are programmed by myself and run completely async after the on page load event. For the ads we are working on a hack to load them async, however this isn’t stable yet. The only left over part is the iam.js script. which is running sync. This is the only party I’m not allowed to change, since it is used to track the germany publisher ranking. Really sucks that they only supply a synchronous script, but it should be reasonable.

I’m not that experienced in page speed optimizations yet, thus it would be interesting for me to know which part exactly makes the page load so horribly slow? And how can I figure this out? I think up to 40 sek on mobile devices is just not acceptable for clients.

How can I activate the mod_pagespeed setting to insert image dimensions and what is it doing?

And by the way thx for your awesome expertise!

No prob. As I think I said, I spent an entire month (January 2014) messing with this stuff, and a mix of Amazon’s CDN, our new server, mod_pagespeed, etc.

I think I mentioned someplace the flaw in Google’s speed algorithm, where one of my test pages got a 91/100 with 47% of page rendering due to blocking elements; combined some files, now only have one blocking element, but less than 1% is considered able to render before loading the main CSS file, and the score went up to 97/100 for desktop and 91/100 mobile with user UX score of 85/100, and the items for the UX score are stupid.

(Test this page, which doesn’t use CDN, doesn’t use WordPress:
http://www.send2press.com/services/ez_price_list.shtml

You can drive yourself to drink with this stuff.

And the super annoying thing is the new expectation by Google for all pages to load via https, which requires SSL cert, and to possibly enably mod_SPDY on server since https is inherently slower than http. But … that’s another story, and the one I’m suffering with now. (Sigh.)

thank you – I’ll do that.

After all, I’m fed up with all this, will try to optimize these last things (best as I could p.e minify the main css) and then focus on another things. (as you maybe notice I’m to focused in that)

sorry for all my questions by the way. I’m pretty new to this.

Hi Cherry
you might want to keep ONE thread, vs starting three or more regarding your site and pagespeed. Basically if you get all the things updated already covered in your other two threads, then mobile speed will also increase.

Again, as I’ve noted previously, you can’t do anything about the external ads being served which impact speed. Not sure how you’re loading ads on a demo site anyway, frankly. You should turn ads OFF for testing your “actual” speed. So the “errors” for mobile for the javascript and images from Google ads and advertisement browser caching, are impacting your score but nothing you can address and are false positives vis a vis the site and theme.

You *can* minify the main .css file which is showing as NOT minfied, as we’ve already covered in your prior threads.
Minifying http://cherrykoks.de/…ntent/themes/Newspaper/style.css?ver=4.1 could save 7.1KiB (16% reduction) after compression.

And basically don’t use contact form 7 unless you actually need it. Since you don’t have a live site, why would you need somebody to contact you anyway at this stage of your playing with the theme and setup without actual content. If you’re planning to use that, then you could presumably add its css to bottom of the main style.css, then hack the plugin to not write its own CSS into the head of the theme; or this would be example of where — as you’d asked elsewhere — you would add the plugin to the speedbooster plugin code to get it dumped at bottom of theme and optimized.

And remember best to test a post page for score not home page, since most people do NOT land on a site home page, but “surf in” to content from a social media link/share, or search result page, etc. — home page will always be a trickier prospect since it’s not indicative of the rest of the site, using sliders, modules, more photos, ajax loads, etc.

Also be aware you cannot get a 100/100 score with a WordPress site running numerous photos, plugins, ads, social media hooks, etc. Only people who have accomplished this have done custom sites without images, using CDN, and custom coding to maximize above the fold content load separate from below the fold content.

If you get above 80 on mobile and above 90 on desktop, you can really get on with your life and worry about content and marketing.

• This reply was modified 12 years by simchris.

Hi,
fyi if your server is setup properly you don’t need to put the gzip/deflate element in your htacess as it’s set at the server level as always on; unless you need that for your CDN – but that is more likely to have gzip/deflate on for speed anyway.

For plugins modification/addition to the speedbooster; obviously this only applies to the js and css related stuff which is purpose of tagdiv speedbooster. You don’t need to mess with an image optimization plugin, for example.

The world won’t end if you don’t remove the query strings, btw. Most WP sites leave that as-is and are successful due to content and marketing, not the query strings. Also note it might be an incremental “conflict” with this dot revision of theme and speed booster; meaning the benefit of the speed booster being on is greater than losing the query strings. Google uses them, so you can too. It’s “ideal” to remove them but that might not even improve stuff by one point, particularly if you test that with Pagespeed Insights directly vs GTMetrix.

However, you are correct, it would seem like you could remove the "?ver=" and test. Why not try it ? You’re not running a live site, obviously, so if you crash, no biggie. Just remove the plugin, and put it back.

Has anyone a suggestion for better Mobile Speed?
https://developers.google.com/speed/pagespeed/insights/?url=cherrykoks.de

already minified these- and still not good enough – on desktop it’s “acceptable”

http://gtmetrix.com/reports/cherrykoks.de/MAxHG3vb

Was thinkin’ about to combine the 3 css files into 1 – (p.e everything in stylesheet.css) but don’t know how where to change the “calls” for html. (which file and which code there? )

Is it useful to combine? The internet community is torn about that issue.

• This reply was modified 12 years by Cherry.

Ok FYI if interested, I reinstalled again yesterday because of the things Steven told me.

Well Chris- I still use the W3 Cache (page only) and wrote the rest of .htaccess by myself, like u posted in another thread. (little bit proud on myself that it did not crash 😀 )
Is everything ok with that or have any other suggestion?

See my current htaccess here:

# BEGIN W3TC Page Cache core
<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /
    RewriteCond %{HTTPS} =on
    RewriteRule .* - [E=W3TC_SSL:_ssl]
    RewriteCond %{SERVER_PORT} =443
    RewriteRule .* - [E=W3TC_SSL:_ssl]
    RewriteCond %{HTTP:Accept-Encoding} gzip
    RewriteRule .* - [E=W3TC_ENC:_gzip]
    RewriteCond %{HTTP_COOKIE} w3tc_preview [NC]
    RewriteRule .* - [E=W3TC_PREVIEW:_preview]
    RewriteCond %{REQUEST_METHOD} !=POST
    RewriteCond %{QUERY_STRING} =""
    RewriteCond %{HTTP_COOKIE} !(comment_author|wp\-postpass|w3tc_logged_out|wptouch_switch_toggle) [NC]
    RewriteCond "%{DOCUMENT_ROOT}/wp-content/cache/page_enhanced/%{HTTP_HOST}/%{REQUEST_URI}/_index%{ENV:W3TC_SSL}%{ENV:W3TC_PREVIEW}.html%{ENV:W3TC_ENC}" -f
    RewriteRule .* "/wp-content/cache/page_enhanced/%{HTTP_HOST}/%{REQUEST_URI}/_index%{ENV:W3TC_SSL}%{ENV:W3TC_PREVIEW}.html%{ENV:W3TC_ENC}" [L]
</IfModule>
# END W3TC Page Cache core
# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
# END WordPress
AddType text/javascript .js

# BEGIN Expire headers
<IfModule mod_expires.c>
ExpiresActive On
ExpiresDefault "access plus 5 seconds"
ExpiresByType image/x-icon "access plus 2500000 seconds"
ExpiresByType image/jpeg "access plus 2500000 seconds"
ExpiresByType image/png "access plus 2500000 seconds"
ExpiresByType image/gif "access plus 2500000 seconds"
ExpiresByType application/x-shockwave-flash "access plus 2500000 seconds"
ExpiresByType text/css "access plus 700000 seconds"
ExpiresByType text/javascript "access plus 700000 seconds"
ExpiresByType application/javascript "access plus 700000 seconds"
ExpiresByType application/x-javascript "access plus 700000 seconds"
ExpiresByType text/html "access plus 600 seconds"
ExpiresByType application/xhtml+xml "access plus 600 seconds"
</IfModule>
# END Expire headers

# BEGIN Cache-Control Headers
<IfModule mod_headers.c>
<filesMatch "\.(ico|jpe?g|png|gif|swf)$">
Header set Cache-Control "public"
</filesMatch>
<filesMatch "\.(css)$">
Header set Cache-Control "public"
</filesMatch>
<filesMatch "\.(js)$">
Header set Cache-Control "private"
</filesMatch>
<filesMatch "\.(x?html?|php)$">
Header set Cache-Control "private, must-revalidate"
</filesMatch>
</IfModule>
# END Cache-Control Headers

<IfModule mod_headers.c>
    Header unset ETag
</IfModule>
<IfModule mod_alias.c>
RedirectMatch 403 /xmlrpc.php
</IfModule>

# pass the default character set
AddDefaultCharset utf-8
# BEGIN Keep-Alive
<ifModule mod_headers.c>
Header set Connection keep-alive
</ifModule>
# END Keep-Alive

#BEGIN GZIP 
<IfModule mod_deflate.c>
<filesMatch "\.(js|css|html|php)$">
SetOutputFilter DEFLATE
</filesMatch>
</IfModule>
#END GZIP

#BEGIN CF ALLOW
Allow from 2400:cb00::/32
Allow from 2606:4700::/32
Allow from 2803:f800::/32
Allow from 2405:b500::/32
Allow from 2405:8100::/32
#END CF ALLOW

As you can see I had to add the keep-alive code and other stuff like gzip- because otherwise GTMetrix would complain about that.

http://gtmetrix.com/reports/cherrykoks.de/4DKTK3Af I guess I can not influence the the both points about cloudflare?

The only thing I’m little bit confused about, is the fact that the mentioned code

 foreach ($this->styles_for_footer as $style_id => $style_src) {
            echo "<link rel='stylesheet' id='" . $style_id . "-css'  href='" . $style_src . "?ver=" . $current_theme_version . "' type='text/css' media='all' />\n";

in the booster plugin causes my strings. Can I change that?

And:

in the Pagespeed guide from tagdiv I read this:

The plugin will move the theme and recommended plugins js and css at the page bottom. If you have other plugins installed you have to modify the Speed Booster plugin file so it will also move those files at end of the page. In the next section you will learn how to accomplish this.
4.2 To get the list of registered css and js add the following code at the end of the functions.php file:
function td_inspect_scripts() {
global $wp_scripts, $wp_styles;
echo ‘registered scripts<br>’;
foreach ($wp_scripts->queue as $handle) {
echo $handle . ‘ | ‘ . $wp_scripts->registered[$handle]->src . ‘<br>’;
}
echo ‘registered styles<br>’;
foreach ($wp_styles->queue as $handle) {
echo $handle . ‘ | ‘ . $wp_styles->registered[$handle]->src . ‘<br>’;
}
}
add_action( ‘wp_print_scripts’, ‘td_inspect_scripts’ );

SpeedBooster plugin ist runnin as you know, do I have to change that as advised?

The sentence with “If you have other plugins installed you have to modify plugin so it will also move those files”

Other plugins means = every plugin I’m using? No problem to add this code to functions.php – just wanna make sure if this is right.

• This reply was modified 12 years by Cherry.
• This reply was modified 12 years by Cherry.

@Manuel
obviously in your case you have elements loading from something like 7 external sites, graphics loading from the network portal vs localized, and it looks like you don’t have the setting activated for mod_pagespeed to insert image dimensions.

@sbo
obviously in your case, if your speed is 62 then you need to address all the elements on your server for caching, expiration headers, gzip/deflate, image optimization, etc., which is what this thread is all about and worth reading through 🙂

@Manuel, I agree. My mobile speed is 38/100 (http://screencast.com/t/CbPRQZycSI) and desktop speed is 62/100 based on Google Pagespeed. Any suggestions?

I’m still not happy with the pagespeed on http://www.dailycat.de even I have optimized it quite a bit. Thus I set up google analytics page speed tracking. Maybe the results are interesting for the tagdiv team.

Mobile devices and especially tablet devices load much slower than desktop. I know, gsm and edge connection aren’t the best, however maybe its reasonable to load smaller images and reduce page heaviness for mobile devices.

https://www.dropbox.com/s/hbwpl7r4tfr6nhk/pagespeed-device-comparision.png

Second, there are some mobile devices which are much slower than others. especially android mobile. The followeing screen is the page load time compared to the websites average. I think it may be worth taking a look at the page speed performance of safari and mobile android browser, since the amount of people using them are significant.

https://www.dropbox.com/s/o43rv8lcb6ltm0n/pagespeed-mobile-android-browser-slow.png

https://www.dropbox.com/s/wlhhyj8uxe9y9qy/pagespeed-safari-slow.png

Any Ideas to improve performance on dailycat are welcome! Thx, guys for this awesome community here!

• This reply was modified 12 years by Manuel Fink.

And remember to get your “real” Pagespeed from Google Insights turn off your AdSense stuff temporarily, as the errors from that you can’t do anything about, and are not technically part of your “real” score 🙂

Hi Chris

Well I was searching for the exact code you were talking about for queries in the “pagespeed” thread, on which page is it? Can’t find it 🙁

btw: site with CF now :

http://gtmetrix.com/reports/cherrykoks.de/J8E4DNks

Just for fun you might want to check out this topic, but work “backwards” for my later posts on stuff like mods, and tricks 🙂

https://forum.tagdiv.com/topic/pagespeed/

Also if you want a warm and fuzzy, be sure to test your site for “page speed” with all Google advertising “off” for the real score.