Search Results for 'minify'

Some our sites generate 2+ million page views per month and have been online 14 years with 230,000 inbound sites for pagerank. We have been managing our own servers since 1996, and ran a hosting company from 1996-2005. We did Oprah Winfrey’s ecom solution for her “Begin with Love” videos a decade ago. Pretty savvy. We are also PCI-DSS certified, and have weathered serious server attacks so have complex security stuff in place. ‘=)

We do use nginx along with Apache 2.2 – for instance phpmyadmin runs on nginx. 32GB of RAM, dedicated 1GB switch at SoftLayer in Texas. Power to burn. Replaced our 2008 server with 12GB RAM and 8 cores. Wild times compared to the days of, say Cobalt RaQ4 (google it).

Still playing with mod_pagespeed stuff as they have lots of cool things like “inline_google_font_css” (Inlines small CSS files used by fonts.googleapis.com into the HTML document.) which I’ve not yet been able to get working. Defer javasceript is another one built-in which is cool.

Stable version from November, edge version from January, and you can’t mix ’em.

Anyway… I’m trying to find the balance of the traditional hacks
1) mods to the wp-config.php
2) mods to functions.php
3) mods to htaccess (Apache)
4) manual optimization of css file if a rewrite system breaks it
5) upload best practice optimized images to begin with; generate smaller thumbs to start with using built-in compression of WordPress vs plugin for initial files; remove duplicate sizes in media setup to match theme size

6) use mod_pagespeed to manage cache (with memcache, eAccelerator, APC, etc.); rewrite on the fly to cache copies with comments removed, delete white space (instant minification!); combine CSS, combine JS, etc.

6) when all that fails to keep a “92” dump the CSS/JS onto the CDN, keep images local.

This is my mission for January. Once done, I’ll have a better sense of what actually works and what is truly a fool’s errand.

BTW: my friends at GTMetrix have a nice plugin for WordPress for testing/tracking pagespeed adventures (recommended!).

MOre later in the pagespeed “forum” here 🙂

I will probably end up doing some kind of ebook for this whole shenanigans.

Chris

• This reply was modified 12 years by simchris.

We own our own server, so we’re running mod_pagespeed on Plesk[ne Parallels]11/CentOS6.5 in order to solve some things across different types of content sites (not all WordPress). Being able to defer javascript with WP is helpful. Being able to recompress images at server level, combine small PNGs to sprites, etc. mean we don’t have to use Smush.it, EWWWW, etc. for most things. Using the built-in WordPress compression level function to make thumnbails generate at “50” vs “80” also a big help before anything else is done. Idea is trying to run stuff at server level above the PHP stuff where possible vs having plugins being called as each page renders. Nice thing with mod_pagespeed is also inserted image dimensions for “responsive” images for faster page render. E.g., on one of our sites the images are 400×300, but render on page at 70% of the column “width” via CSS — mod_pagespeed will actually rewrite the actual size on page (e.g., 431xNNN) for faster page load. Some really interesting stuff. We run memcache and are storing cached elements in RAM and on the disk, before the page write – so, in theory, this is a level above using a cache “plugin” in some ways (although end result is same probably).

Still testing 🙂 Just got a good working version across all sites as of Tues. night (two days ago). 10 days of “try this, nope. try that, nope. WTf? Oh! What? Hey! Oh. Okay…” … 😉

Seems like you should already be able to minify the .css for the main style sheet if you know all that stuff ! Kind of surprised Super Cache isn’t able to minify.

But sounds like you’re an above average user, so likely you’ll be able to come up with a solution for the CSS minification if you don’t want to do it manually.

I’m suffering an 82/100 desktop at the moment due to addthis, google syndication/adsense, and youtube video on a page. 92+ with that noise off and no cache plugin (!).

We stripped out the Google font calls entirely, and did search/replace in style.css for default fonts. Got rid of the stupid Google insights “error” for their own stupid fonts.

It’s a process. Since we have a shiny new 12 core Xeon server, been trying to get this tweaked to do as much as possible at top. Considering adding Varnish, but another pain in the butt to sort out. Day 16 of the “how much can the server do to fix stuff on the fly” adventure. Would be nice if Google fixed their own crap for Insights to at least give a reasonable speed grade taking into account THEIR problems.

No magic bullet. Funny how some “experts” who claim 100 pagespeed are running sites with plain text, no graphics and one ad on page, and then try to give advice for those running newspaper/magazine sites which by nature are very complex.

Thanks Christopher. I took a look at mod_pagespeed, but it doesnt look like it could do anything for me at this point. I’m already on a VPS that runs Plesk 11 with nginx as a reverse proxy. I’m letting nginx handle all php scripts and serve static and dynamic content. Gzip compression is enabled and i enabled browser caching through nginx with the expiration set to two weeks. I’m running WP Super Cache as well to create pre cached pages and i use EWWWW Image Optimizer to optimize all images. I also optimazed all theme and plugin images with that plugin. You might want to look it up, imo it really is a better plugin than smush.it and so. I use the simple minify plugin to minify all javascripts and i my pagespeed currently toggles between 85 en 92 for desktop, depending on my server response time and between 70 and 80 for mobile. The only red warning i still get is to defer javascript and css (moste google fonts, and 3 theme css files: bootstrap, style.css and child theme style.css) to below the fold, but i have no experience on how to do that. Im really pleased with the pagespeed right now, but more tips (besides using a CDN) are welcome!

Thanks for you responce anyway 🙂

Note to all, we found it’s better to manually minify the main style.css file each update.

HERE IS HOW TO:

The easy way to minify your main style.css file, is to
1) in your theme folder, make a copy of the style.css file (rename style-bak.css or whatever)
2) take the style.css file and open in a text editor (NOT a word processor), like Notepad or TextPad on Windows, or similar.
3) copy and paste all the text from the file into a minifcation online tool like one of these:
– http://refresh-sf.com/yui/
– http://cssminifier.com/
4) copy the “minified” output into a new style.css file
5) upload via FTP to over-write the style.css file in your theme root

Now when you run PageSpeed Insights it won’t bug you anymore. I do this and works just fine.

r1kay
to clarify, mod_pagespeed is not a WordPress plugin, but is used at the server level and is being used by many “speed oriented” web hosting providers now, including many that specialize in WP hosting specifically (and larger folk like GoDaddy, etc.).

The easy way to minify your main style.css file, is to
1) in your theme folder, make a copy of the style.css file (rename style-bak.css or whatever)
2) take the style.css file and open in a text editor (NOT a word processor), like Notepad or TextPad on Windows, or similar.
3) copy and paste all the text from the file into a minifcation online tool like one of these:
– http://refresh-sf.com/yui/
– http://cssminifier.com/
4) copy the “minified” output into a new style.css file
5) upload via FTP to over-write the style.css file in your theme root

Now when you run PageSpeed Insights it won’t bug you anymore. I do this and works just fine.

If none of that is remotely possible for you to do, then don’t stress over it. You only gain maybe a point for doing this, along with a couple of other things. Image optimization is far more important, and limiting use of plugins which “dial out” from your site to load things on the page beyond your content (social media “counters” for instance – plain buttons load faster).

You likely haven’t seen mention of mod_pagespeed as you have not been looking through the “pinned” topic at top of forum on “Pagespeed” issues.

Note when minifying the css file, it will save 20% of the space, but it doesn’t speed anything up by 20% or improve rating by 20%. If it saves more than 20kb then it’s worth it. If it saves less than 20kb may not be worth the trouble.

ALSO: be aware each time you update theme you will need to re-compress the style sheet using one of the tools above.

Hope that helped.

And how about css? Pagespeed said that i could save 20% by minifying style.css, but no minify plugin will minify the themes css file. Is the tagDiv Speed Booster plugin included in the version 2.2? And i never seen anyone mention mod_pagespeed plugin on this forum, what does it so?

Hello,

someone use W3 Total Cache, Minify option?

I am trying to optimize my site using the Minify option, but is not about simple. Any option break the layout, so I trying to use “Manual” minify, and add what “js” and “css” minify and combine.

Someone who use this method, can tell me how files optimize?

Thanks!

I read this interesting topic and decided to do a check myself.

I use wp smushit, wp minify and total cache (page cache as per tagdiv’s instruction)

Google Pagespeed: 88/100 (desktop) and 73/100 (mobile)
GTMetrix: 93 Pagespeed, 76 Yslow.

Historically I always received a much lower grade with Yslow. Guess they don’t like my site 🙂

Now I will experiment with Christopher’s tip with the .htcaccess.

And one tip to others: don’t get obsessed with getting high grades… I’ve been there a couple of months ago… for 2 days I slept at 4 AM trying to figure it out :/ It became an obsession. Spend your time in the nice things of your website 🙂

Holiday PageSpeed Fun Report Update!
Just as a pagespeed comment, I was testing mod_pagespeed, vs your tagdiv cache experimental, and W3 with page cache on, and found that mod_pagespeed on server with memcache, optcache and eaccelerator, seem to be about the same effect. What this means for most WordPress folks is quite simple: use a hosting provider that supports mod_pagespeed (e.g., GoDaddy now supports it with htaccess local config options — NOT an advert for them, just anecdotal) may be better option than messing around with all the various plugins that try to replicate that server-side functionality.

To Radu and all … who are wondering about the “render blocking blah blah” errors, this was one of the suggested solutions for WP (note the issue is common to ALL WP themes frankly due to the way the header works for most themes based on “traditional” HTML practice, 2 years ago nobody really cared about this issue!):

(QUOTED from WordPress.org discussion, “wpgeekster”)
The reason you are getting render blocking message from google is because your javascript is being called in the header. In your wp_register_script() function and in your wp_enqueue_script() function you must include true for the $in_footer argument. If you include the $in_footer argument, you must also include all the other arguments.
See:
http://wp.tutsplus.com/articles/how-to-include-javascript-and-css-in-your-wordpress-themes-and-plugins/
http://codex.wordpress.org/Function_Reference/wp_enqueue_script
http://codex.wordpress.org/Function_Reference/wp_register_script

(END QUOTE)

From same discussion:

(QUOTED from “manuelkuhs”)
Here’s what I figured out about how to eliminate all render-blocking JS & CSS:

Install W3 Total Cache

Go to Minify

Use the “help” wizard that you can see as a button near the top

Accept the suggestions without making changes. This will combine all your CSS files into 1, and all your JS files into 1, 2 or 3, depending where you load them (if you load all in the same area, e.g. in the <head>, you’ll only get 1 combined file).

Set all JS to “Non-blocking using Async”.

Now test your site. If everything works, the only blocking CSS/JS file left should be your combined CSS file, and nothing else.

Most likely some JS functions won’t work properly anymore. If this is the case, it gets a bit more complicated.

In this case, try the following:
Remove all the JS files in the Minify settings of W3

Open the source of your functioning page where no JS files are combined and manually add to W3 Minify ONLY the JS files found in the header (since these are the ones “above the fold”) and IN THE ORDER that they exist in your source file. Try this. If it works, try moving them all into the <body> or just before the </body> using the Minify JS settings.

In my case, I had a strange issue whereby combining jquery.js with the other JS files broke many js functions that depend on jquery even though they loaded after. To get around this I made jquery.js load on its own after <body>, and made all the others load combined just before </body>, with everything set to load using async.

Using this method, the only “above the fold” problem I have is the combined CSS sheet.

If your combined CSS is small, you can try inlining the entire thing.

If not, the only way around this that I currently know is to manually inline only the relevant parts of this combined CSS, and then to load the combined CSS in the footer using JS.
(END QUOTE)

• This reply was modified 12 years by simchris.

@Marija1m1 …

See the threads on page speed. Follow Radu’s recommendations for how he got the demo theme to be 90+.

REF: https://forum.tagdiv.com/how-to-make-the-site-faster/ .

To save you having to read Everything on the forum:

Fonts can’t be optimized on your side or by the theme, as they live on Google’s website. Digg buttons are loading from Digg’s website. No way to optimize that. I don’t think sharedaddy is part of theme. You either have to load the font stuff locally and optimize CSS since Google “dings” their own stuff in PageSpeed (!) or switch to web-safe fonts (see my and other comments above on this topic).

For styles, you need to either minify if you don’t intend to modify for your site; or use a WP minify plugin. See my link to the site I use to minify my css and js code.

WP by default loads elements in the head and “enqueues” them to render the page. All WP sites will have a “render blocking code” in head error. For javascript (.js files) You would need to try the optimization plugin included with theme, or a WP plugin which moves the js to footer “elegantly.”

Hope that helped. 87 is a great starting point and that means you’re in the “zone of safety” as I like to call it. 85 or below is “bad” 87-89 is okay. 90+ is rockin’. 😉

Chris

• This reply was modified 12 years by simchris.

Yes, the site is now without any cache, no minify etc.

vidapropria
1) reduce image sizes either by running compression plugin and/or adding compression factor to your functions file
2) faster server account, if you keep seeing “slow response from server” error — that was a [!] item on your last report speed check — nothing can be done about that with the theme, or in WP; that is how fast the account you have and your hosting provider is responding to ping/start showing the page. For example if you have a $5/month account, upgrade to $10/month account (I’m just using that as example). Low cost accounts are usually on a machine or VPS being shared with 1,000+ other sites. Slightly more costly hosting accounts give more resources to each site, by sharing the resource pool with fewer domains.

Verify deflate/gzip working; remember this only serves up faster versions of your content, but doesn’t optimize them prior to that. I think I saw a 100K image file in your last report … that is waaaaaaaaay too big. Try using smushit plugin and regenerate thumbnails to see if that helps? (Backup images first as changes to images on server will be destructive — meaning they are changed and cannot be unchanged).

Also, for testing if you’re using a child theme, be sure to try NOT using a child theme to see if that gains you a point.

However RECOMMENDED:
1) optimize images before/after upload
2) look at better hosting – if you keep getting “slow to respond” error from Google — no way around that on your side.
3) test without using DISQUS, as this does slow things down. We stopped using it for that reason. We’re leaning toward phasing out comments on most sites, per industry practice now that most comments tend to be trolls and arguments (see: CNN for example). Any comments plugin really slows stuff down on WP. Unless you gain ad revenue from 10,000 visitors per day, it’s not really an essential plugin, and more of a glamour thing (in my opinion).
4) turn off all jetpack stuff for speed test — anything that connects to the WP/Automattic mothership adds latency.

Hope that helped 🙂

————–
as an aside on pagespeed errors:
I’m actually dealing with even more arcane stuff like how to enqueue the parent Theme’s style sheet in the child Theme’s functions.php, to bypass the annoying @import not recommended error from Google which the Automattic folks seem to think is a non-issue. I will post my efforts on THAT noise if anybody cares.

[ UPDATED ]
I just ran your GPS test, and saw you’re up to 82/100 desktop. So, looks like you’re making progress. The images issue is the next thing you need to resolve. You’ll have several points for that, as reducing the footprint of your images speeds up page (e.g., if you go from 300K to 150KB; that’s 50% less time loading images!).

For the minification stuff… note you would need to use a plugin for that (WPminify) although this has some issues; -or- you need to manually minify SOME resources which are not already reduced in size. RADU doesn’t minify all the code as developers have a hard time modifying code if they can’t read it.

So, if you knew there were a couple of large CSS/JS files you might want to minify, you can easily do that using an online tool (I use this one, although it won’t work with IE11/Win7 properly … use Chrome or similar: http://refresh-sf.com/yui/ )

Basically, “minification” of CSS and Java/js files removes the extra spaces, comments, and line breaks to make file “more compact” … so if you had a 125Kb CSS file, by removing all the spaces, line breaks, comments, it might end up being 100Kb, which is the kind of reduction that PageSpeed looks at — the idea being if you had 5 files being loaded on page and you reduced all of them by 20kb – well, that’s 100Kb and is larger than what website developers like me used for the entire page and graphics 10 years ago (we used to shoot for 50kb max page load, if you can imagine that!) …

• This reply was modified 12 years by simchris.

Thanks, that was the workaround, not activating minify. Unfortunately without minify activated the site doesn’t have optimized speed. There is no other solution that we can do and have minify enabled?

Hello, I tried to disable the minify but the problem persists. The floating menu does not work either on your demo site.