#hpw (124 links)
- CSS Stress Testing and Performance Profiling | Andy Edinborough andy.edinborough.org
thecssninja: Some CSS rule making your page lag during scrolling? Find the culprit with this handy bookmarklet by @andyedinborough: http://t.co/s6VNT8a
- Performance Calendar » PNG that works calendar.perfplanet.com
Great breakdown of different PNG formats.
- Web Performance Optimization Hub >> Strangeloop » Strangeloop strangeloopnetworks.com
A directory of performance-related research, tips, tools, case studies, articles, and blog posts.
Built on WebPagetest, provides "HTTP waterfall chart, a Page Speed report, connection info, and screenshots" for iOS and Android devices.
- How to Write Efficient CSS Selectors - O'Reilly Answers answers.oreilly.com
From Even Faster Websites.
- High Performance Web Sites :: Evolution of Script Loading stevesouders.com
- Let's make the web faster - Google Code code.google.com
Google's list of performance tools.
- Official Google Webmaster Central Blog: Make your websites run faster, automatically -- try mod_pagespeed for Apache googlewebmastercentral.blogspot.com
- Django Packages : Asset managers djangopackages.com
Comparison of "Asset managers for combining/compressing JavaScript/CSS and for versioning your media files."
- Using a CDN to speed up WordPress – HttpWatch Blog blog.httpwatch.com
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."
- High Performance Web Sites :: Render first. JS second. stevesouders.com
Rendering first and executing JavaScript second is the key to a faster Web.
- yepnope.js | A Conditional Loader For Your Polyfills! yepnopejs.com
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.
- Tracking Code and Click Response Delays - Ravelrumba ravelrumba.com
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.
- High Performance Web Sites :: newtwitter performance analysis stevesouders.com
Souders' performance analysis of #newtwitter.
- High Performance Web Sites :: WebPagetest.org and Page Speed stevesouders.com
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.
- Highly Maintainable, Efficient, and Optimized CSS slideshare.net
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.
- High Performance Web Sites :: Diffable: only download the deltas stevesouders.com
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.
- Data URIs make CSS sprites obsolete | NCZOnline nczonline.net
The jury is still out on this'un.
- High Performance Web Sites :: Back to blogging after Velocity stevesouders.com
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.
- High Performance Web Sites :: WPO – Web Performance Optimization stevesouders.com
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.
- Perfection kills » Optimizing HTML perfectionkills.com
- ImageOptim – PNG/JPEG/GIF optimizer for Mac OS X imageoptim.pornel.net
"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.
- Pagetest - where web sites go to get FAST! webpagetest.org
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.
- High Performance Web Sites :: Google Analytics goes async stevesouders.com
It’s extremely cool to see this pattern being evangelized for such a major piece of the Internet.
- minify - Project Hosting on Google Code code.google.com
"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.
- LABjs: new hotness for script loading | getiblog blog.getify.com
"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.
- High Performance Web Sites :: @font-face and performance stevesouders.com
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."
- High Performance Web Sites :: Business impact of high performance stevesouders.com
"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.
- svg-icon-loader code.google.com
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.
- High Performance Web Sites :: Aptimize: realtime spriting and more stevesouders.com
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.
- Why The data: URI Scheme Could Help Save Your Slow Site sitepoint.com
Lots of caveats but useful under certain circumstances.
- High Performance Web Sites :: Mobile Gmail and async script loading stevesouders.com
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.
"Enables you to easily add Microsoft Ajax Library and jQuery scripts to your Web applications" if, horror of horrors, you should need to do something involving MS Ajax.
- High Performance Web Sites :: SpriteMe makes spriting easy stevesouders.com
The bigger challenges when creating sprites are finding the background images and knowing how to group them into sprites. Once the sprite image is created, testing the sprite, including changing all the CSS, is time consuming. SpriteMe addresses all of these challenges.
- Mozilla Webdev » Blog Archive » Cesium 0.1 Released! blog.mozilla.com
A hybrid web application/testing harness that automatically runs YSlow on a suite of pages of the user’s choosing at scheduled times, stores these results, and provides a host of graphs and other data concerning the results of these tests.
- OmniTI ~ YSlow! to YFast! in 45 minutes. omniti.com
While OmniTI has enormous breadth in the Internet space, we are primarily known as an Internet performance and scalability company. This made the fact that we received an F on YSlow! all the more embarrassing. This was a case of the right hand not knowing what the left hand was doing — something we evangelize against. I decided that I would fix that and aim to do it by the end of Steve’s presentation. A play-by-play follows.