Tag Info

Hot answers tagged

18

Someone is going to say that the markup should be Gzipped, so I might as well be the one. Here's a lengthy explanation of what Gzip is with links on how to set it up on Apache and IIS. An article on WebReference states that you'll find the following performance gains when using the mod_gzip Apache module. Webmasters typically see a 150-160% increase ...


16

Yahoo's tips for improving page sped Google's tips for improving page speed If you're using PHP, Google's tips for making PHP faster Here's a basic list as comprised from Google's Page Speed addon (here's Yahoo's YSlow): Leverage browser caching Specify image dimensions Avoid CSS @import Avoid bad requests Combine images into CSS sprites ...


14

There are a few things you can do: Load the HTML and CSS before the javascript. This gives the browser everything it needs to lay out the page and render it. This gives the user the impression that the page is snappy. Place script tags or blocks as close to the closing body tag as possible. Consider using a CDN. If you are using any of the popular ...


12

Smashing Magazine did 2 great articles on PNG Optimization and JPG optimization. They're quite in-depth, explaining in great detail some things you may not know about the formats and their implementations. For example, the JPEG article: "Keep in mind that when you set the Quality to under 50 in Photoshop, it runs an additional optimization algorithm called ...


12

Sure. Obviously, it would be better to use CSS alone but if you can't, use what you have. Do as much as you can with CSS and use JS as needed. Not sure why you can't change the existing CSS but you can add a style sheet with JS. (function() { //create a new element var newStyle = document.createElement("link"); //set the required attribute for a ...


11

Option 2 is the worst; it means that every page with a different combination of needed JS scripts will result in an HTTP request. It will make performance much worse. Option 1 is the best. Eventually most users will visit most of the page "types" of your website, so it's still advantageous to combine everything into a single file, with maybe the exception ...


11

The Net tab of the Firebug console (remember to disable browser cache). Resources view of the Web Developer Tools in Chrome/Opera. Fiddler. HTTP Watch. WebPageTest. Gomez. We use WebPageTest and Gomez for server tuning, Fiddler if there are any hard to diagnose problems, then the rest for front-end experience testing. Once you have the level of ...


10

Massive sites like Google, Facebook and Twitter don't necessarily get the 'best' servers in that they don't run a small number of high-powered servers, they run a massive number of smaller and cheaper servers. They expect hardware to die and be replaced and the code allows for that. Some things that are typical in massive scale sites: They don't use SQL ...


9

When saving photographs in Photoshop I recommend using File > Save for Web and Devices. It will allow you to play with compression levels and see the visual result in real time. On photographs you can usually save it lower than level 8 and still get great results.


9

It probably isn't worth it. I've played with removing whitespace in HTML a little bit, and saw only a 10% size reduction in payload after gzipping. Realistically, whitespace and linefeed removal is doing work that the compression would be doing for us. We're just adding a dab of human-assisted efficiency: Raw Compressed ...


8

I highly recommend Google Closure Compiler for compressing JavaScript code. I use it personally, and it is also the official compressor used by the jQuery project. This project can do quite a lot, but the basics are this: java -jar closure.jar -js javascriptFile.js > javascriptFile.min.js


8

This isn't very friendly. Search Engines can understand the content but might not be able to consider COMPANY as one single word. My suggestion is to use JavaScript. You can write something like This is our company name: <span class="company">COMPANY</span>. Then use JavaScript to load the content of the .company class split/stylize the ...


7

Reducing the size of files will certainly reduce bandwidth and shorten page load time. The first time a user hits your site they won't have anything cached, and for most sites first time visitors are the majority of the traffic. Additionally, make sure you have gzip compression enabled. This will do a drastic amount to reduce bandwidth.


7

One of the key things to understand when doing A/B testing is the statistical significance of your results. Some good posts on this can be found here: Easy statistics for AdWords A/B testing, and hamsters Statistical significance & other A/B test pitfalls Significance of Statistically Significant Results in A/B Testing


7

You might want to look at the way Google loads Analytics as well: <script type="text/javascript"> var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-xxxxxxx-x']); _gaq.push(['_trackPageview']); (function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == ...


7

Besides Minifing, gziping and CDNing (new word?). You should consider defer loading. Basically what this does is add the scripts dynamically and prevent blocking, allowing parallel downloads. There are many ways of doing it, this is the one I prefer <script type="text/javascript"> function AttachScript(src) { window._sf_endpt=(new ...


7

ETags are an alternative to (but can be used in combination with) "Last-Modified-Time" in order to determine cache validation. The client can send a pre-condition such as if-matches or if-none-matches based on the ETag. This is not just for GET requests (which is what webpagetest.org does) you can use "opportunistic updating" so that a PUT request has a ...


7

First, you'll have to figure out exactly where your site is slow: is it in database processing? Is it in the front-end servers? Is it in the wordpress processes? Bandwidth? Maybe your host can help you figure out where your bottleneck is. (They probably want to sell exactly the right amount of CPU/Memory/Database/Bandwidth, to give you the most bang for your ...


7

If you're using Firefox, you could install a page-speed analyzing-addon like yslow or google page speed - this tells you how to optimize your website (sometimes not all of the optimizations are possible, but some are easy to do). this are some of the hints yslow gives for your site: This page has 27 external Javascript scripts. Try combining them into one. ...


7

Your assertion that you are better off with one, bigger CSS file is correct. It will likely be only a few KB when gzipped, and should be cached, so not a huge overhead. There are a few things worth checking though. If some CSS is only ever used on one page, it may be better in that case to put the CSS on the page, in some style tags. (Note: this can make ...


6

In reply to the title of your question, "Site performance" in Google Webmaster Tools is measured as "the total time from the moment the user clicks on a link to your page until the time the entire page is loaded and displayed in a browser". And it's collected from people that have the Google Toolbar installed, with the PageRank feature activated. Source: ...


6

Those sites are correct. It's Google who got it wrong this time. They made the mistake of making SEO conflict with usability. And most site owners tend to choose SEO over user experience. Unfortunately, until Google fixes their algorithm, we're probably going to see more and more sites titling their pages this way. Edit: Just to give an example of how this ...


6

I would certainly recommend caching the tweets in your database or a plain text file. As soon as you start getting a lot of traffic you will be creating many hits to the Twitter API and going over their limit. And since you're not tweeting every 30 seconds day and night (I hope!) you could just end up fetching the same thing over and over. In terms of ...


6

the other 4 are only used for a word or two Is that a literal statement? If so why are you bothering to embed these fonts at all, subsets or not? You shouldn't even be optimizing in this case, just removing. Make images of the text you need and use your favorite text-replacement technique. You're adding HTTP requests and download time to your site for ...


5

Google has outlined and explained their recommendations to best Minimize Payload Size. They include the following techniques: Enable compression Remove unused CSS Minify JavaScript Minify CSS Minify HTML Defer loading of JavaScript Optimize images Serve scaled images Serve resources from a consistent URL These suggestions are a part of their open-source ...


5

I've developed a relationship with a dozen or so freelance designers. Most of them are quite happy to slice a PSD layout into (X)HTML conforming to the standard of my choice. Most also happily convert it into a Wordpress, Drupal , Joomla , etc theme with very little turn-around time. I'd head to odesk, freelancer.com, etc and put a few projects out for bid. ...


5

To paraphrase Coding Horror's excellent evaluation of the YSlow Firebug plugin (which it appears WebPageTest.org is using as a basis for their evaluation): "Yahoo is one of the busiest websites in the world - its problems are probably not your problems." If you're not dealing in millions of uniques across your load-balanced network every day, there's a ...


5

There are an awful lot of possible optimizations, but installing WP Super Cache will almost certainly solve your immediate problem. I host my blog on a 1gb Linode and have handled tens of thousands of requests some hours, without the VPS even breaking 10% CPU usage. That's possible solely due to the static caching that WP Super Cache provides.


5

Recently i stumbled upon an excellent article about CSS3 Gradient Buttons, and that gave me the kick to change to pure CSS instead of background images. The same style applies to different width's and height's of buttons and even adapt to the used font size. It can also be used on buttons as well as links and other elements. I found it to be much easier to ...


5

I think this is a shortcoming of the speedtest tool that you're using, that it doesn't look at the whole site and see which CSS is never used at all. If you can find a tool that does, let us know! I think you are much better off just creating one big file that can be cached. Yes, that makes sense, unless there's a set of pages that need an extra bit ...



Only top voted, non community-wiki answers of a minimum length are eligible