[tutorial] Chris’s custom optimizations for functions.php, etc.

@Magistar

Hi
those remove the WordPress version, the manifest link, the RSD link (Yoast can also disable two of those, but why do it with plgin if you can do it yourself)

the two feed items remove secondary feed RSS like ATOM, and also the comments RSS.

Chris

Oh! Hey, that’s a good idea 🙂

Less “cluttering” than making it sticky. That way you can put “breaking alert” stuff as a sticky, such as a “top 5 issues with WP 4.4” — whichi would make a much better sticky.

Happy holidays!

Chris

I know you don’t want questions but this isn’t really a question regarding anything specific about what you wrote. I appreciate the post! – Just wondering, I’m paying for MaxCDN as well as using W3 Total Cache. Have you compared your local changes compared to using CDN and caching system? Is it safe to just disable the cache plugin (which implements the cdn) – and compare page speed insights? and then reenabling if the difference is worth it? It’s a live site – trying to avoid errors to current traffic.

@larceny
in my case we have dedicated high speed server in Class-A datacenter. So for us, using most CDN stuff doesn’t help us. We tested this thoroughly, hence the effort to optimize “in place” vs relying on external resources.

For whatever your situation is, you will have to A/B test how it works for you and your content, layouts, hosting plan, etc., as that varies from site to site.

Yeah I turned off cache plugin, which in turn turns off the CDN. The page load was significantly different. Was multiple seconds different (by me just loading the page in my browser with no cookies). Was ridiculous. But I don’t think thats the experience with everyone… I dunno.. but thanks, I’ll try and do more testing. Just seems to load the images very very slow with cdn (though even slower without) – and I don’t understand why, besides this template being extremely bloated.

Most important thing is to stop serving live pages and start serving static html pages. You can do this with W3totalcaching, just make sure page caching is enabled. Also it will NOT cache for logged-in users. So test in another browser…

If you have a regular hosting plan a non-cached php page will load in something like 900ms. On a slow host you can even see 2000+ ms. If you use a good host (pm me if you are looking for a fast one) you can get this down to about 300ms. When you switch to html pages you can go as low as 30ms.

CDN is only useful for international websites. I use it on one of my websites because it allows visitors from the US and Asia to load my page faster (hosted in The Netherlands).

Exactly, CDN is best for edge hosting (being able to load frequently loaded content at a closer locale). A CDN is also useful if you get periodic traffic surges (e.g., featured on Reddit or something), as it allows you to get a big overload without having complex load balancing (we’re talking something like jumping up to 1 million views in a week or something … this happened to us once and holy crap!). And it can be useful for some common stuff like jquery as it gets cached in browser so is not reloaded if everybody is loading it off Google’s server.

Also note that some CDN setups don’t properly gzip/deflate everything unless you set that up — some are managed, some are just like your own site meaning you have to manage TTL, CORS, expiration of content to refresh, gzip/deflate, headers, etc.

Frankly http/2 is going to be more mission critical with hosting services, and http/2 + mod_pagespeed is very powerful.

Chris do we paste the code into child theme function.php?

I tried adding it to main function.php file but broke my site lol

not sure which of the functions is causing this, haven’t test yet.

I don’t use child themes; don’t believe in them unless absolutely necessary as they are a CSS redirect, which I don’t like. Different from an “includes.” So, ideally if using child theme you would add it to the child functions.php if there is one — but I can’t speak as to it working or not working with child theme. Part of optimization process is NOT using child theme, was my point 🙂

Sooooo….. one of the items might conflict with child theme. I put mine in main functions.php at bottom.

(obviously, if you’re not using Yoast SEO, for instance you would not need to put in the code for YOAST that I use … you also might not want to remove the versioning with some CDN setups that need that to see new version to recapture … etc.)

For this theme I have tried it.But I am currently at 7 modifications. Every time there is a theme update I regret it. You always have to re-apply custom changes and keep a very detailed list of how and why to do it. With a child-theme you can just save a copy of the modified php file and feel free to update the theme at any time. So I actually hate not working with Child themes.

And hence why there is coke and pepsi … 🙂

If you run a website for 10 years or longer at some point you find that with major updates the child themes need to be updated too and defeats the purpose. But whatever works for you is what works best for you. I manage 20 sites, some online for 16 years and updated daily, so I do things a little more “time management” focused in the long term. I also don’t update my themes every time there is update as I often don’t need the new bells/whistles requested by others. So, I’m usually many versions behind, and like it that way !

Always interesting to see that other people have different views :).

I basically used the same logic to go in a completely different direction. On my older Joomla and WordPress based websites I didn’t know how to create overrides and such. The more websites I got (currently about 8 now) and the more time passed (oldest is 2008), the harder it was to remember what I did and why.

So I started to create these detailed log files to deal with that. Of course after a year I always had to search for those files because I forgot where I left those logs :P. The most annoying stuff I did was editing the style.css directly. That meant that every time I wanted to update I had to do a code comparison between files that were by definition not similar!

In the end I got fed up with “wasting” my time and invested time and effort to learn how to create overrides and unload functions for both Joomla and WordPress. Now I am glad I did because it is saving me so much time. All minor updates are now handled automatically by the server. Major versions I have to manually “order” so I can check if nothing went wrong. This is basically a 95% reduction of time I spend on maintenance.

Of course there are some downsides. It takes more effort to implement and you have the @css import, which is not SEO optimal. And yes at some point you will need to re-apply your changes on the latest files. Child themes do not make you immune to change.

Don’t forget about the importance of updating though. Last year there were some serious security exploits in a lot of themes. Years ago a leak in the Joomla upload function once resulted in a php script being uploaded that was used to send emails. Not fun :(.

Yep. We stay on top of all best security practices, especially since we have our own web server, and ran a web hosting and ecommerce company for 10 years (1996-2005). I’m also frequently found in Twitter in the #infosec tag.

We’re also PCI-DSS certified which means our server is massively scanned for known issues on everything from php to TLS 1.1, to known exploit files. We also have Securi scanning, and all sorts of other shenanigans. 🙂

But yes, we keep on top of security. But basically don’t need to do every update to every theme just to stay up to date on features or bug fixes to stuff we don’t actually use.

Nice :).

If you are using Elegant Theme’s something seems to always break on every major WordPress update :P.

Anyway I just noticed the following code:

<!--[if lt IE 9]><script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]--><style type="text/css">.recentcomments a{display:inline !important;padding:0 !important;margin:0 !important}</style><!--[if lte IE 9]><link
rel="stylesheet" type="text/css" href="http://www.x.info/nl/wp-content/plugins/js_composer/assets/css/vc_lte_ie9.min.css?152966" media="screen"><![endif]--><!--[if IE 8]><link
rel="stylesheet" type="text/css" href="http://www.x.info/nl/wp-content/plugins/js_composer/assets/css/vc-ie8.min.css?152966" media="screen"><![endif]-->

Did someone find a fix for that one? I am already using Chris’s example:

/*remove visual composer*/
add_action('init', 'myoverride', 100);
function myoverride() {
remove_action('wp_head', array(visual_composer(), 'addMetaData'));
}
/*remove Visual Composer CSS from “post” pages */
function dequeue_visual_composer_css() {
if (is_single()) {
wp_dequeue_style('js_composer_front');
}
}
add_action('wp_enqueue_scripts', 'dequeue_visual_composer_css', 1003);
/*clean head */
remove_action( 'wp_head', 'wp_generator' ) ;
remove_action( 'wp_head', 'wlwmanifest_link' ) ;
remove_action( 'wp_head', 'rsd_link' ) ;
remove_action( 'wp_head', 'feed_links', 2 );
remove_action( 'wp_head', 'feed_links_extra', 3 );
/*remove 4.2 emoji*/
remove_action( ‘wp_head’, ‘print_emoji_detection_script’, 7 );
remove_action( ‘wp_print_styles’, ‘print_emoji_styles’ );


• This reply was modified 10 years by Magistar.

I tend not to worry about those as they ONLY load if somebody is running IE8 or IE9, both are deprecated (obsolete) browsers, so additional elements needed to make modern themes/sites/CSS work with those old insecure and security-borked browsers. So, they only load for those folks and not everyone else.

I think that’s in the header.php if you wanted to quash them. But, why?

Pagespeedscore is only 68 right now. Have to start somewhere right :P.

Oh and which smushing plugin do you prefer? I dislike wp smush (it?) plugin because it pollutes your database to keep track of which images it has smushed.

Hi!
Great Tips!
I have a problem/
I’ve installed 2 versions of newsmag. In one i use your optimizations, on the second i don’t. Post view counter in both desktop versions of template, on both domains are working, but in the site which i use your optimizations on the mobile version post view counter doesn’t work. Can you please tell me what line of code must remove to work?

@Magistar
I don’t use a smushing plugin. I optimize my images prior to upload then change the compression level for thumbs per my tips in the first pages of the thread.

@virjik
if you’re using Jetpack, you have to remove the portion which turns off the XML-RPC stuff in the functions.php file, I believe. Also note that if using the Ajax counter, that might not work with some mobile devices if blocking certain javascript stuff. Dunno.

Hi !
Thanks!
I dont use jetpack. I tested on my phone both sites. Anyway i created a topic in the forums. Thanks for your time CHRIS and good luck.
Great optimizations tips!

For those who need to move the style.css to footer for above the fold critical CSS setup,

see this thread

https://forum.tagdiv.com/topic/help-moving-style-css-and-fonts-googleapis-com-to-footer/

options include
a) use speed booster

b) de-enqueue the style.css
c) manually put style.css link in footer.php

Hi Chris,

The code in that thread, where is it inputted? Also, would it cause a delay in the css loading. I haven’t used the speed booster but of this delay. The jerky load of the page is annoying and not a good look I like out there.

Welll…..

a) if you use the speed booster framework, you would put the code into the Speed Booster plugin settings per the docs for that and the example from Lucien; *and* likely any custom css into your style.css and not in theme panel; and ideally NOT use child theme, to mimize any flash of unstyled text

b) if you’re doing custom hacking of your site, you would put any functions for de/enqueue into the functions.php where all such WordPress “actions” go; then you’d manually put your style.css link in footer. The WordPress codex has good tutorial on how “enqueuing” (adding to queue) works in WP.

c) You would then use the critical CSS generator found in my thread, to put the above the fold CSS “inline” in the header.php file. This loads only the needed CSS for above the fold to load with page — no render blocking of CSS — and then the rest loads with remainder of page. — Trial and error on this stuff.

These efforts are toward solving the pesky lower score on Google PageSpeed Insights for mobile “above the fold render blocking…”

This is a bit “advanced” stuff most folks won’t tackle. But if you’ve got everything ELSE as optimized as possible, this is kind of the LAST thing to do.

And frankly, if you’re using the AMP system for mobile, for a lot of folks, this will be a non issue as Google products will be loading the AMP version vs the responsive mobile version anyway.

So, one could argue if you have a desktop score of 92 or higher, and you’re running “AMP” on your site for posts, you likely don’t need to stress as much as before on the mobile score on Google’s direct testing speed tool. 🙂

( rant over . . . ) 🙂

• This reply was modified 10 years by simchris.