Search Results for 'faster'

I think in the readme for the tagdiv plugin, he says something about the colors not sticking for customization.

The “flash of unstyled” content is usually a sign something is loading before something else, so you see one version before other fully loads. I run into this with custom fonts, and sometimes with a style color. The tagdiv plugin is basically queing up the elements to load faster, but this can cause oddities based on “order things load.” It’s a trade off at the moment for speed vs compatibility — and with caching, your browser (especially chrome) may keep the one style, before it gets to the next style which has the custom colors.

Not technically a bug. I’m running the plugin and seems to work okay I hacked my colors.

(HINT: actual fix is to edit the default blue in the style.css file or wherever that element thing is so that the “over ride” color is in fact the “default” color.)

“tagDiv speed booster is still in beta! Currently it is affecting the theme customizer and probably some plugins. This plugin is for advanced users only. We are still working on it.”

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.

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.

mehedi,
see how Radu got the demo to the pagespeed
https://forum.tagdiv.com/how-to-make-the-site-faster/

“speed” is a process which requires many tools to accomplish, no one theme “magically” has high pagespeed. YOU need to research and implement many things separate from the theme to achieve a high pagespeed ranking, including NOT using various things like adsense, or plugins which “dial out” to get resources. But, if you follow the link above, Radu explains how they optimized the demo site.

You should also read through this thread, as you may need to update your htacess file for expiration headers, optimize your images, etc.

tarquisti:

see – ask your hosting provider to set caching for your site: https://developers.google.com/speed/docs/insights/LeverageBrowserCaching

try using my expiration header settings in your .htaccess file
https://forum.tagdiv.com/topic/what-is-your-googlespeed-value/

try using an image optimization plugin for wordpress to make images smaller in size (compression) and then use the thumbnail redo plugin recommended by Radu

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

@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.

Hey BoredDaddy…
I will be offering this as a service again next year (WP optimization service) once we revamp our sites (ongoing); in midst of deploying new web server right now and sorting our memcache + eAccerlator + Google’s mod_pagespeed at server level. In midst of new server, and migrating our sites over, blah blah. The really arcane stuff is having mod_pagespeed convert images to Google’s new “in house” image format to load faster where it has a built-in image pyramid, with what we used to do for lowsrc (b/w image) to load as a progressive layer while the color image loads in. Wild stuff.

But to answer your question:
If you follow Radu’s little shortlist, that is a good “starting point” to get your site ramped up. His plugin does bunch of the stuff, and if you use that, turn off any whacky “phone home” plugins which are resource hogs, check your htaccess file for expiration headers, optimize your site images, and whatnot, you’ll be in good shape.

Use GTmetrix as a slightly more friendly and forgiving starting point for PageSpeed test, as it will actually tell you HOW to fix stuff. The Google version seems to be a little off, especially their latest version which catches all their own code as errors (!).

Hello there,

About page speed, i read a FAQ https://forum.tagdiv.com/how-to-make-the-site-faster/ and found:

make sure that you have compression enabled on your site for html/js/css but not for images

What is the best plugin for html/js/css compression which is compatible with Newspaper?

Thanks,
Sandall

This page seems to do it even faster (images disappear)

http://www.waytoosocial.com/sociallifestyle/a-guide-to-surviving-the-real-world/

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.

Hi, vidapropria
don’t forget you still need to set expiration headers, and possibly get a faster hosting account – 4 seconds response is pretty slow on top of the page loading time.

You might try loading my suggested “expiration” data for your htaccess file (see other post on this topic), which goes at bottom of htaccess AFTER the wordpress stuff.

Looks like you need to
1) speed up server time to < 2 sec. if possible (try using a speed test closer to your country, if your site is regional and not international: use Google’s webpagetest.org and choose location closer to you)
2) set expiration headers – this is MANDATORY for page speed! (SEE: https://forum.tagdiv.com/topic/what-is-your-googlespeed-value/ )
3) further optimize images using an image plugin like (WP Smush.it – or similar); backup images before running any plugin on your images, so that you can restore if unhappy with results.

Hope that helped. Try the expiration headers data for the htaccess file first. It really really helps!

• This reply was modified 12 years by simchris.

Just fyi on web fonts …
since the fonts are being loaded from Google’s CDN, there isn’t really any way to “optimize” Google’s loading of those fonts in the way some of you may think – how can the theme optimize something living on Google’s CDN ?. Although “technically” one might remove the &ver=3.71. for some very minor compliance in moving away from that kind of versioning data in WP.

How we did it on our static main business site (not running WP except for news and blog areas, but it’s the same concept in how you might “super optimize” YOUR setup), was we downloaded the equiv fonts (Open Sans family), created style sheet, uploaded both CSS and fonts to our own CDN (S3/CloudFront), setup CORS rules, and now load the fonts off of Amazon’s cloud where we could set expiration times of one year, and compress, etc. In our case we did it both to control all the font parameters for PageSpeed and also the whacky bug in IE for not loading the true italic version of fonts off Google’s CDN without manually inserting calls to all font versions one at a time for IE which results in loading 8 font families per page). Using a custom style sheet to load all the fonts, we load just ONE file for the reg/reg italic, bold/bold italic and solve two issues with Open Sans.

For “most” people you need to setup your compression, and time to live (expiration headers) on YOUR end of things before anything else – that is not a function of the theme. Google how to do that, or contact your hosting provider. Then move on to the other stuff. As GZAM pointed out, and as I have previously, the compression and expiration headers alone account for about 20 points or more in Google Page Speed.

Fonts are a tricky bit, where any “designer” fonts, slow down page regardless, as they have to be loaded from somewhere. For those looking for “fastest speed” once everything else is done, you might have to NOT use custom fonts at all, and sub out Trebuchet MS for the menus, and something like Georgia or Arial/Helvetica for the body text.

Spending the $2 a month for Amazon’s CDN (or similar) is one way to speed up your fonts, vs loading them from Google directly, but that is something you need to try, modify, test, modify, test. For example, we use Font Awesome, and we tested loading that off the cloudflare hosted version vs our CDN on Amazon – Amazon was faster so we load that from there.

Not sure if any of that helps. It is a process, not a one click thing to optimize a page for ‘speed’ — there is NO “one click” solution out there due to complexity of servers, content, and everything being loaded on the page.

For example on optimization — if you want faster speed, what about image compression level using built in functions of wordpress? Did you know you can use a plugin or function to increase the compression level of the thumbnails appearing on the pages? Smaller files there make page load faster even before server side gzp/deflate. These are the kinds of things you need to research if trying to optimize your site for fasted load times.

For example, you could set the compression of images to something like 60% or even 50% in your child theme functions.php … will only change level on new images uploaded unless you use the regenerate thumbnails plugin or similar.

add_filter( 'jpeg_quality', create_function( '', 'return 50;' ) );

I’m not sure what Radu has the quality set to by default, but increasing the compression even 10% from the default improves speed.

Additional ref:

switch ( $mime_type ) {
 case ‘image/jpeg’:
return imagejpeg( $image, $filename, apply_filters( ‘jpeg_quality’, 90, ‘edit_image’ ) );
case ‘image/png’:
return imagepng( $image, $filename );
 case ‘image/gif’:
return imagegif( $image, $filename );
 default:
 return false;
 }

Google’s webpagetest.org actually recommends quality level 50 for web images.

We are shooting for “60” at the moment (60/100 compression is not percentage of compression, btw).

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

Hi – just my 2 cents –

before doing anything (theme out of box on new shared server) – had page speeds of 45 mobile and 58 desktop

then, added gz deflate code to htaccess file, and configured W3 total cache – and now my google page speeds are: mobile 75 and desktop 92 – and I am fine with it

In my opinion, for shared servers – wordpress isn’t going to get much faster than that…

the gz deflate had the most increase (I forgot to track the exact increase – but it was over 20) – if someone needs to know how to do this – I would recommend asking support on your hosting site –

I added back “addthis” plugin – and desktop speed only went down to 91 – but for me totally worth the “add this” value…

I should also note that I currently do not run ads on my sites (still developing content) but I agree that will slow it down a bit (that was mentioned)

One thing I would like to know if the theme could clean this up though (from google speed test)

Optimize CSS Delivery of the following:

http://fonts.googleapis.com/css?family=Open+Sans%3A300%2C400%2C600%2C700&subset=latin%2Ccyrillic-ext%2Cgreek-ext%2Cgreek%2Cvietnamese%2Clatin-ext%2Ccyrillic&ver=3.7.1
http://fonts.googleapis.com/css?family=Ubuntu%3A300%2C400%2C500%2C700%2C300italic%2C400italic%2C500italic%2C700italic&subset=latin%2Ccyrillic-ext%2Cgreek-ext%2Cgreek%2Clatin-ext%2Ccyrillic&ver=3.7.1
http://fonts.googleapis.com/css?family=PT+Sans%3A400%2C700%2C400italic&subset=latin%2Ccyrillic-ext%2Clatin-ext%2Ccyrillic&ver=3.7.1
http://fonts.googleapis.com/css?family=Oswald%3A400%2C300%2C700&subset=latin%2Clatin-ext&ver=3.7.1
http://fonts.googleapis.com/css?family=Roboto+Condensed%3A300italic%2C400italic%2C700italic%2C400%2C300%2C700&subset=latin%2Ccyrillic-ext%2Cgreek-ext%2Cgreek%2Cvietnamese%2Clatin-ext%2Ccyrillic&ver=3.7.1

Radu HDSLR.com.br is 1000x FASTER then FilmMaker.com.br
the plugin “form maker”is only on HDSLR
Filmmaker.com.br V1.7.1
HDSLR.com.br v1.0.1

http://hdslr.com.br/wp-content/uploads/2013/11/fundos.jpg

I still do not understand you, have you read the code I edited?
Or did you outsource support now you have sold 1500 theme and you feel too confident that you start giving refunds instead of helping with theme related only the developer can help with (unlike the many same mostly stupid questions you answer over and over again because of using the comment system on theme forest where the community cannot colmment on someone elses thread or because of that same comment system not being searchable). Its ok but you should have hired a coder for support. Because your answer shows me that you do not understand or that you just did not read this thread

https://forum.tagdiv.com/topic/featured-video-and-dailymotion/#post-1614

you could at least have answered

Can you please help me with the following and tell me if I could have done it better

to make these things template features/options so that when I update it will not break, its just a few on and off switches
option to make featured image float left or right, while being nicely responsive
option to show featured image on video pages instead of replacing it with featured video
option to have featured image of single video pages to scroll to video when clicked
how to make the scroll to video nicer, also your scroll to comments (so that it scrolls and doesn’t jump)
a feature to have the video icon as a image watermark so that we will have to call one less image in template, will be faster and also for facebook thumnail the video icon will be in the image
why have you added this
.format-video p {
padding-top: 11px !important;
}

Hi,

I believe you are confusing this thread with another one.

1. your theme does not support child themes and does not have an option to make modifications without them being overidden when updating the theme
2. You are not using core wordpress functions to get the thumbnails, therefore plugins cannot hook into your featured images
3. You have told me and others before that you will add dailymotion support
4. I am not asking for custom work! I am asking for a way to display the thumbnail in the video post and the video at the bottom with an onclick scroll to video. And just said that if you would add the video icon as a watermark it would be better and faster
5. I have given you the solution, just need you to make a few switches in the theme options so everyone could have this option and it would not break upon update, I am not one of those who waits until he is fed
6. ….. please read my questions again

Like the theme in general and I am one of those who is willing to help others, so please help me

https://forum.tagdiv.com/topic/problem-with-visual-editor/

Thank you

Hi,

Here is what I have been able todo so far:
http://staging1.wp.gem-diamonds.com/news/one-of-a-kind-10-carat-royal-blue-diamond-for-sale-in-new-orleans

1) re-sized the image in functions.php

//featured image
$td_crop_features_image = td_util::get_customizer_option('crop_features_image');
if ($td_crop_features_image == '') {
 //add_image_size('featured-image', 700, 0, true); 
 add_image_size('featured-image', 320, 0, true);
} else {
 //add_image_size('featured-image', 700, 357, true); 
 add_image_size('featured-image', 320, 180, true);
}

2) added some custom css in wp-admin/themes.php?page=editcss
To make the image float on the right (not a good way does not play nice responsive, please tell me a better way)

.post .thumb-wrap {
	text-align: center;
	margin-bottom: 5px;
	background-color: #f2f2f2;
	float: right;
	margin-left: 10px;
}

3) edited /wp-content/themes/Newspaper/includes/app/modules/module_modifier/td_module_blog.php
so that video pages show featured image

function get_image($thumbType, $image_link = '', $image_excerpt = '') {
        global $page;
        if (!empty($page) and $page > 1) {
            return;
        }
        //echo 'raxxx' . $page;

        if (td_util::get_option('tds_show_featured_image') == 'hide') {
            return;
        }

        if (get_post_format($this->post->ID) == 'gallery') {
            return;
  //      }

 //       if (get_post_format($this->post->ID) == 'video') {
            //if it's a video post...
  //          $td_post_video = get_post_meta($this->post->ID, 'td_post_video', true);
 //           $td_video_support = new td_video_support();
 //           if (!empty($td_post_video['td_video'])) {
 //               return $td_video_support->renderVideo($td_post_video['td_video']);
 //           }
        } else {
            //if it's a normal post, show the default thumb

            //get the full url
            $attachment_id = get_post_thumbnail_id($this->post->ID);

            $td_temp_image_url = wp_get_attachment_image_src($attachment_id, 'full');

            $image_excerpt = get_post_field('post_excerpt', $attachment_id);
            if (!empty($image_excerpt)) {
                $image_excerpt = '<p class="wp-caption-text td-featured-image-caption">' . $image_excerpt . '</p>';
            }

            $post_image = '';

            if (!empty($td_temp_image_url[0])) { //if we have a full url, link the image to that
                $post_image = parent::get_image($thumbType, $td_temp_image_url[0], $image_excerpt);
            } else {
                $post_image = parent::get_image($thumbType, '', $image_excerpt);
            }

            return $post_image;

        }
    }

4) edited /wp-content/themes/Newspaper/includes/content_builder/td_module.php
so that only on single video pages a click on image would scroll to video

$buffy .= '<div class="thumb-wrap">';

            if (current_user_can('edit_posts')) {

                $buffy .= '<a class="td-admin-edit" href="' . get_edit_post_link($this->post->ID) . '">edit</a>';

            }
			
			if ((get_post_format($this->post->ID) == 'video') and (is_single($post))){
			
			$buffy .='<a  href="#video" rel="bookmark" title="' . $this->title_attribute . '">';
			
			} else {

            $buffy .='<a ' . td_util::if_show($show_colorbox_class, 'class="td-featured-img"') . ' href="' .

                $image_link . '" rel="bookmark" title="' . $this->title_attribute . '">';

			}

Can you please help me with the following and tell me if I could have done it better

1. to make these things template features/options so that when I update it will not break, its just a few on and off switches
   • option to make featured image float left or right, while being nicely responsive
   • option to show featured image on video pages instead of replacing it with featured video
   • option to have featured image of single video pages to scroll to video when clicked
2. how to make the scroll to video nicer, also your scroll to comments (so that it scrolls and doesn’t jump)
3. a feature to have the video icon as a image watermark so that we will have to call one less image in template, will be faster and also for facebook thumnail the video icon will be in the image
4. why have you added this

   .format-video p {
   padding-top: 11px !important;
   }

Thank you

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

+1 to this post, i’d like to know as well. And how we get it faster.