"Why performance matters for e-commerce"

"Now that we’re seeing wide-scale adoption of front-end optimization best practices, misapplication of these best practices could be delivering “false positives” — sites that test well but look bad for real users."

Impressive. Expensive.

Must remember. "Which is better: mylogo.1.2.gif or mylogo.gif?v=1.2? To gain the benefit of caching by popular proxies, avoid revving with a querystring and instead rev the filename itself."

"Ditch media="print" if you have one! (Hey why isn't this a yslow/pagespeed rule?). Ditch it because in the best case scenario it will only block onload. In the worst case it will block initial paint, onload and DOMContentLoaded. Sitting in front of a white page with no feedback is the worst possible user experience."

"Real-world connection simulator and bandwidth limiter." Very handy.

"The problem is that once you send HTTP headers for really aggressive caching (i.e. cache me for a week or a year or forever), these files aren't ever reliably loaded from the server any more and you can't make changes/fixes to them because things will break in people's browsers.

So, what companies have to do is stage these changes and actually change the URLs of all of these files to force people's browsers to reload them. Cycling through domains like "a.imwx.com", "b.imwx.com" etc. is how this gets done.

By using a nonsense domain name, the Javascript developers and their Javascript sysadmin/CDN liaison counterparts can have their own domain name/DNS that they're pushing these changes through, that they're accountable/autonomous for.

Then, if any sort of cookie-blocking or script-blocking starts happening on the TLD, they just change from one nonsense TLD to kyxmlek.com or whatever. They don't have to worry about accidentally doing something evil that has countermeasure side effects on all of *.google.com."

"Let that picture sink in: at 180KB of JS on average, script isn’t some helper that gives meaning to pages in the breech, it is the meaning of the page. Dress it up all you like, but that’s where this is going."

Useful.

"In terms of web performance, the experience we need to measure is user perceived page load time, and the single number we need to extract depends on the distribution of measurements across the sample. There are a few contenders for what the magic number should be. Do you use the mean, median, mode, or something else? How do you determine the correctness of this number or whether your sample size is large enough? Is one number sufficient?"

Potentially useful. "An AssetGraph object is a collection of assets (nodes) and the relations (edges) between them. It's a basic data model that allows you to populate, query, and manipulate the graph at a high level of abstraction. For instance, if you change the url of an asset, all relations pointing at it are automatically updated."

Great review of @font-face performance by Dave Artz: http://t.co/CqPOUaBY

"Python CSS/Javascript minifier"

"Automated lossy JPEG optimization"

.@kangax did some amazingly thorough research on CSS performance, using @operadfl’s new CSS profiler: http://t.co/ctXLRb1z /via @chriscoyier

Lossy is a scary word but when it comes to images it provides dramatic savings & minimal loss in quality via @sergeyche http://t.co/Idddi9Ac

"SpeedLimit is a Leopard preference pane for limiting your network bandwidth to one of a couple different speeds — 768k DSL, Edge, 3G, and Dialup."

Cross-platform ImageOptim alternative.

"In his High Performance Mobile presentation at Mobilism in Amsterdam, Netherlands Steve Souders discussed the importance of performance on the Web, why it is even more important on mobile, and a set of emerging best practices for faster mobile Web site."

codepo8: Google Analytics now offers a site speed report, including page load times: http://mths.be/aza

thecssninja: Some CSS rule making your page lag during scrolling? Find the culprit with this handy bookmarklet by @andyedinborough: http://t.co/s6VNT8a

Great breakdown of different PNG formats.

A directory of performance-related research, tips, tools, case studies, articles, and blog posts.

OK!

Built on WebPagetest, provides "HTTP waterfall chart, a Page Speed report, connection info, and screenshots" for iOS and Android devices.

From Even Faster Websites.

Google's list of performance tools.

Comparison of "Asset managers for combining/compressing JavaScript/CSS and for versioning your media files."

Web performance ammunition in Forbes. "The lack of consistent Internet access and speeds across geographies can be both a risk and an enormous opportunity for your business as it expands. Put simply, the businesses that can best optimize their websites and applications for better performance across the globe will have a distinct competitive advantage in the years to come."

"Rendering first and executing JavaScript second is the key to a faster Web."

A small wrapper around LABjs to help use feature detection to load exactly the scripts that your user needs, not just all the scripts that you think they might need.

"Aside from choosing not to install tracking solutions that come with such a performance penalty (which is not always an option), your best option is to replace the default 500ms timeout in these scripts with something less obtrusive. 100ms is considered the threshold for what we perceive as instantaneous response."

Good stats. "If you’re using jQuery on a public-facing site, use the Google CDN to host it." But don't use latest version in production.

Souders' performance analysis of #newtwitter.

"One area where WPO needs more standardization is performance analysis. There are numerous performance analysis tools available, including Page Speed, YSlow, AOL Pagetest, MSFast, VRTA, and neXpert. There’s some commonality across these tools, but the differences are what’s noticeable. To get a thorough performance scrubbing, web developers have no choice but to run multiple tools and sift through the different results trying to find the most important recommendations. It would be better for developers to have a more standard way of analyzing performance across environments. The Page Speed SDK provides a path to achieve this."

Nothing particularly surprising, a few contentious parts: pretty decent round-up of ideas that are in reasonably common usage.

"I created a CSS test page, which started out as a crude way to figure out if there was a noticeable performance difference between SASS’s @extend and OOCSS’s method of CSS."

"Diffable uses differential compression to reduce the size of JavaScript downloads. It makes a lot of sense. Suppose your web site has a large external script. When a new release comes out, it’s often the case that a bulk of that large script is unchanged. And yet, users have to download the entire new script even if the old script is still cached."

The jury is still out on this'un.

Mmmm.

Top 10 Velocity sessions based on the attendee ratings, including The Top 5 Mistakes of Massive CSS by Nicole Sullivan and Internet Explorer 9 by Jason Weber, Microsoft.

"This convergence of awareness, even urgency, on the business side and growing expertise in the tech community around web performance marks the beginning of a new industry that I’m calling “WPO” – Web Performance Optimization."

Not entirely buying all the arguments in this one but raises some very worthwhile points.

"Optimizes images [...] by finding best compression parameters and by removing unnecessary comments and color profiles. It handles PNG, JPEG and GIF animations." Be interesting to see how this stacks up against smush.it.

Shows "a waterfall of your page load performance as well as a comparison against an optimization checklist."

"A Google Chrome extension that helps you identify and fix performance problems in your web applications. It visualizes metrics that are taken from low level instrumentation points inside of the browser and analyzes them as your application runs. Using Speed Tracer you are able to get a better picture of where time is being spent in your application."

"It’s extremely cool to see this pattern being evangelized for such a major piece of the Internet."

"A PHP5 app that helps you follow several of Yahoo!'s Rules for High Performance Web Sites. It combines multiple CSS or Javascript files, removes unnecessary whitespace and comments, and serves them with gzip encoding and optimal client-side cache headers." Hubba, hubba.

"A general purpose script loader that aims to be able to effectively load any script resource(s), from any location, into any page, at any time. It loads them all as parallel as the browser will allow, but maintains execution order when you express the need to do so in the usage of the API, for keeping dependencies safe." Very pleased this has gone 1.0.

"An HTTP viewer and debugger that integrates with IE and Firefox to provide seamless HTTP and HTTPS monitoring without leaving the browser window." Win only, basic (free) and pro (pay) versions.

Ouch. "My first piece of advice is to avoid using @font-face unless it’s critical to the page. The primary reason for this advice is that font files block rendering of the entire page in IE until they’re done downloading. Stylesheets also have this problem. But stylesheets provide styling for all aspects of the entire page, whereas font files only add one thing - a custom font."

"How big an impact does performance optimization have on the business metrics of a typical media or e-commerce site?" Potentially quite a lot, which is why we keep banging on about it.

"Provides a method for a web interface to use SVG images as icons, while being loaded from a single file. This reduces the amount of HTTP requests, offering the same kind of benefit available with CSS sprites."

As well as realtime spriting, Aptimize are using data: URIs in their Website Accelerator tool and doing so for >IE7 using an MHTML workaround. Clever.

Lots of caveats but useful under certain circumstances.

"With mobile on my mind, I was blown away by the awesome performance tips in this blog post: Gmail for Mobile HTML5 Series: Reducing Startup Latency. This post hits on the main point of my recent book - the impact of loading JavaScript. This is the #1 performance issue for today’s web apps."