HTML CSS JavaScript

There's always a slide about performance in my presentations. This time? Every slide will be about performance. I'm chomping at the bit to get started on this one.

The Bocoup guys were crazy enough to invite me down to talk about my favorite topic- front end performance. Here's the write up:

Front End Performance for the Common Man: Practical Strategies to Speed Up Your Site

Day: Wednesday May 19th 2010
Time: 6:30pm – 8pm
Cost: Free

Rob Larsen will examine the core concepts and techniques behind the performance of the web's fastest sites and will translate them into practical examples. This talk will cut across several technologies (JavaScript, CSS, Ant, Apache and more) to present a suite of tools any developer can use to speed up their site- no matter the size or budget. RSVP to The Event Page.

It's going to be a really good talk- full of practical examples and advice for every flavor and level of web developer. You should totally go.

Actually, you should just go to all the Bocoup talks. Smart people talking about killer technology = fun times. I'll be a regular there.

Browser Size does just what the name implies. Enter a URL, hit "go" and you'll see just what percentage of the internet will see what without scrolling. Scrolling isn't quite the bugbear it once was, but for certain types of pages immediate impact is still very important (campaign landing pages are a good example,) so having this as an easily accessible tool is really nice. Sure, designers have these guides in Photoshop and developers can resize the window with the Web Developer Toolbar, but this handy web-based tool is just the kind of thing to use in a meeting.

For an example of the output, here's this site put through the wringer:
Read the rest of this entry »

You use Webmaster Tools, right? If you rely on Google traffic in any way shape or form you really should be using it.

It's an invaluable service and it just got better with the addition of a new, performance specific feature. From the Google Webmaster Central blog:
Read the rest of this entry »

Since I run so many content-centric sites, I've never really had much use for Google Analytics' goals. It's one thing when you're doing lead generation or ecommerce. Those goals are clear and easy to define.

Someone filled out a form? Goal reached.

Someone hit a thank you page for purchasing a book? Goal reached.

For content sites, where the aim is engagement goals are tougher to define.
Read the rest of this entry »

I eat this stuff up. The more data like this we get the easier it is to sell performance to team members and clients.

Do faster web pages mean better business? Definitely. We’ve seen hard evidence from major web operators like Shopzilla, Google, and Microsoft. But what about other websites? How big an impact does performance optimization have on the business metrics of a typical media or e-commerce site?

Proof that speeding up websites improves online business

I got a new machine at work yesterday and in the process of building the thing out and getting it ready to actually work with, I came up with a list of the tools and utilities I use on a regular basis. Not the big stuff (Dreamweaver, Fireworks, Photoshop, etc.) The stuff that fills in the cracks that the big tools don't cover. Thinking such a list might be useful for other folks, I added a couple of online services that I can't live without and am now sharing the highlights of the list with the world.

Read the rest of this entry »

As you could probably guess since Performance is one of the six site categories around here, I'm a fan of WebPageTest. You can imagine my reaction to the news that page load videos are now available from the service.

From Recording video with WebPagetest:

One of the things we like to look at is what a page looks like when it is loading, particularly if you are comparing a before and after or multiple sites to each other. This is particularly helpful when talking to the business about performance and sometimes the raw load times don't adequately represent the user experience.

Up until now this has been a pretty manual process where we screen record a video while loading a site then load it up into Premiere and stitch it together.

Starting today, you can have WebPagetest record a video of a page load directly. It's still in a pretty rough form and it's going to be a while before it'll be ready for the masses but what is there is already pretty powerful and extremely flexible.

read the rest of this article…

Very cool. I can think of two or three presentations where video of page load would have been super useful and will definitely find a use for the feature in the near future.

I've read all the articles and I'm still compelled to write rules like this one I wrote earlier tonight:

#main-menu .primary a{
	color:#7b0000;
}

I know I'm not alone in using rules like that. It's a super common pattern.
Read the rest of this entry »

I finally finished reading Even Faster Web Sites. It's good, but in terms of things for my day to day, it's kind of a mixed bag. In some ways (specifically in the areas of JavaScript efficiency, image compression and CSS selectors) it's more practical than High Performance Web Sites and in others I had a hard time coming up with a concrete example that I'd actually run across that would be served by the topic at hand.

With that in mind, looking at the table of contents I found the bolded chapters most interesting for my day-to-day coding (your mileage may vary, of course)

Chapter 1. Understanding Ajax Performance
Chapter 2. Creating Responsive Web Applications
Chapter 3. Splitting the Initial Payload
Chapter 4. Loading Scripts Without Blocking
Chapter 5. Coupling Asynchronous Scripts
Chapter 6. Positioning Inline Scripts
Chapter 7. Writing Efficient JavaScript
Chapter 8. Scaling with Comet
Chapter 9. Going Beyond Gzipping
Chapter 10. Optimizing Images
Chapter 11. Sharding Dominant Domains
Chapter 12. Flushing the Document Early
Chapter 13. Using Iframes Sparingly
Chapter 14. Simplifying CSS Selectors
Appendix A. Performance Tools

Which isn't to say that the other chapters weren't interesting. They were, I just don't need to deal with some of the issues solved by those techniques very often in my day job. That was especially true of the the Comet chapter and many of the issues related to managing multiple script files and/or large blocks of JS code.

Some comments on the chapters I found most interesting:
Read the rest of this entry »

This may be of interest to some of you:

In this webinar, you will learn how Amazon CloudFront can improve the performance of your website and cost you less than a traditional content delivery service (CDN). Amazon CloudFront is an easy to use, high performance content delivery service that lets you quickly and cost-effectively deliver website content to your users using a global network of edge locations in the United States, Europe and Asia.

You will learn how Amazon CloudFront is different from most traditional CDNs and how easy it is to get started.

Increase the Performance of Your Website With Amazon CloudFront

I use CloudFront at both home and work and love it. It's cheap and performs as advertised. Low-latency, high transfer speeds, rock solid uptime (pingdom has yet to report a problem in nine months) and utilizing edge locations is an obvious benefit (especially to the healthy percentage of visitors my personal site has in Europe.) So, if you're at all interested maybe the above will be just the thing to get you started.

Why bothers? Well, for performance geeks it's the easiest way to clear Yahoo's performance rule #2. Don't you want to be a cool performance geek?