presentation-web-performance-quit-being-so-fast-

Web Performance Monitoring:

Quit Being So Fast!

Who am I?

Gregory Mazurek

Lead Software Engineer at Gilt Groupe, 3.5 years

gmazurek@gilt.com

I also previously worked

in book publishing for 4 years.

What are we talking about?

Basics of performance monitoring.

How do we integrate performance at Gilt?

Why you should slow down, sometimes.

What aren't we talking about?

Native app performance

Magic

Tools

Synthetic Monitoring

Real User Monitoring (RUM)

Performance Timing API

Synthetic Monitoring

Hit your pages from servers remotely.

At Gilt, we use Rigor.com.

Real User Monitoring

Your users generate the data.

At Gilt, we use New Relic.

Performance Timing API

http://bit.ly/fastfastfast

Google Chrome Plugin that

visually displays data for the current website.

Over 400 performance lovers use it.

Gilt wants engineers to feel responsible for performance

PULL Strategy

We pulled them into our presentations.

We pulled them into Rigor and New Relic.

We pulled them into tutorial sessions.

It didn't work.

We were interfering with preexisting patterns for development rather than augmenting them.

So, we PUSHed.

PUSH Strategy

Performance reviewed during monthly KPI meetings.

Distribute company-wide reports.

We -1 commits that are not performant.

That works.

Engineers care about performance.

Our page speeds are getting lower.

Learn from us.

3 things you can do

today

to improve the performance of your website

tomorrow.

1. Make marketing tag performance visible

Use a tag management container (Signal).

Monitor performance of these tags.

Communicate their performance or lack thereof.

Marketing doesn't want to slow the user experience.

They want to know if they are.

2. Performance test new features before they go live

Product team feels responsibility.

Know what's going to happen before you deploy to prod.

Don't regress your current features.

3. Compress your images

Our biggest performance gain.

Get designers approval.

Designers care about performance as well.

What is the difference between these photos?

Nothing :)

But, what is the difference between these two images?

500 kb, the left larger than the right

3 Big Things:

Marketing tags.

Test changes.

Reduce image sizes.

So now you're thinking, "why should I bother to remember these three things?"

"There are so many other things I could do!

The CDN!

Pre-fetching assets!

No more CSS3 animations!"

"Shouldn't I just make my website fast.

Like, real fast!"

"All my users will know my site

as the fastest

in ALL THE LAND!"

And I'm thinking, "your users don't care...

...as much as you care."

Let's talk about books.

How could we measure

the performance of reading a book?

On The Client Side:

How quickly did the text load?

Were the images preloaded?

How soon does a page load upon flip?

On The Server Side:

How long did it take to write?

What was the editing time?

Was it 4-color or black/white?

How long did it take to ship to the store?

A hardcover book !=

trade paperback !=

mass market paperback !=

ebook

Differences in price, size, paper quality, and cover.

But,

hardcover book ~== another hardcover book

trade paper ~== another trade paper

mass market ~== another mass market

ebook ~== another ebook

What is the difference?

The Content.

If a book's format is like a web browser,

the content is like the HTML, JS, CSS.

There isn't an audience of readers

demanding a format

that doesn't exist.

They don't ask for an unknown,

not-yet-created, magic book format.

They want something that looks

and feels

like what they know.

What is the corrollary for the web?

Your user experience should be similar

to other user experiences.

We see this all the time with patterns.

You make it fast!

How fast?

Super fast!

But why?

Because studies say so! That makes sense!

Studies show that

increased page load times

lead to decreased conversion.

But, Gilt did a test a few years back

that proved the opposite.

We slowed

each page request by 1 second.

And, there was no change in conversion.

A lot of times when we think about performance,

we think only about ourselves.

But really, we should consider ourselves

hardcover books

and we should compare ourselves to other

hardcover books.

There's no point to being super fast

if it means losing essential features.

The point is to be reasonable and responsible.

If your goal is speed,

you're going to create a product

based on speed.

If your goal is a good user experience,

you might have to sacrifice a bit

on speed.

You have to decide what is right

for your users

based on your company's objectives.

But one thing is for sure:

if you're a hardcover book

you want to be at least as good as

all the other hardcover books.

Measuring your own site's performance is good.

Measuring your site's performance against your competition is better.

You can use the Google Chrome Extension

as a start:

http://www.bit.ly/fastfastfast

If your website looks, performs, and acts like a hardcover book, it'll be a hardcover book.

In publishing, do you know why we call

a large-format book

with lots of pictures

a "coffee-table" book?

Because they're heavy,

they're difficult to hold,

and they largely go unread.

If you want your website to be a

hardcover book,

don't create a coffee-table book.

In Summary

Know what kind of book format you want to be.

Be as fast as you need to be.

Be similar or better than your competition.

Don't regress in quality.

Don't only obsess over your numbers.

Obsess over your numbers as compared to your competition's numbers.

Thank you!

gmazurek@gilt.com