Client-Side Performance Measurement & Optimization with RailsEric Falcao, FiveRuns

http://austinentrepreneur.wordpress.com

efalcao@gmail.com

The Performance Golden Rule

“Only 10-20% of the end user response time is spent downloading the HTML document. The other 80-90% is spent downloading all

the components in the page”-- Steve Souders

Page on uship.com (30k views/day)

after implementing only one best practice

Performance Optimization Without Measuring?

Good intent but not very scientific

There’s no easy as in Rails-easy way to measure client-side performance

clientperfgem install clientperfclientperf /path/to/rails/apprake db:migrate

/clientperf

Make Less HTTP RequestsLess requests, less HTTP overhead

Combine components wherever possible:

Gzip Components

http { ... gzip on; gzip_min_length 1100; gzip_types text/plain text/html application/x-javascript text/css application/atom+xml text/xml text/js text/javascript; ...}

Huge reduction in response size (~70%)

Add an expires header

server { ... root /home/uberhour/uberhour/current/public;

location ~ ^/(images|javascripts|stylesheets)/ { root /home/uberhour/uberhour/current/public; expires 365d; } ...}

Eliminates 304 Not Modified Requests

Rails helps...

...but you need to add this:

Put Stylesheets at the Top

Everybody already does this....moving along!

Allows the browser to start rendering the page as content is downloaded

Scripts at the BottomScripts are downloaded and block the rest of the component requests while they are being loaded

in the layout:

in the view:

Just a Start

There are now 34 rules broken into 7 categories

Resourceshttp://developer.yahoo.com/performance/

http://github.com/efalcao/clientperf/

http://developer.yahoo.com/yslow/

Questions?