Performance Related Changes and their User Impact Web Search Delay Experiment @igrigorik • The cost of delay increases over time and persists • Delays under half a second impact business metrics • "Speed matters" is not just lip service Type of Delay Delay (ms) Duration (weeks) Impact on Avg. Daily Searches Pre-header 50 4 Not measurable Pre-header 100 4 -0.20% Post-header 200 6 -0.59% Post-header 400 6 -0.59% Post-ads 200 4 -0.30%
Performance Related Changes and their User Impact Server Delays Experiment • Strong negative impacts • Roughly linear changes with increasing delay • Time to Click changed by roughly double the delay @igrigorik
Usability Engineering 101 Delay User reaction 0 - 100 ms Instant 100 - 300 ms Feels sluggish 300 - 1000 ms Machine is working... 1 s+ Mental context switch 10 s+ I'll come back later... Stay under 250 ms to feel "fast". ! ! Stay under 1000 ms to keep users attention. @igrigorik
For many, mobile is the one and only internet device! Country Mobile-only users Egypt 70% India 59% South Africa 57% Indonesia 44% United States 25% onDevice Research @igrigorik
The (short) life of our 1000 ms budget 3G (200 ms RTT) 4G(80 ms RTT) Control plane (200-2500 ms) (50-100 ms) DNS lookup 200 ms 80 ms TCP Connection 200 ms 80 ms TLS handshake (200-400 ms) (80-160 ms) HTTP request 200 ms 80 ms Leftover budget 0-400 ms 500-760 ms Network overhead of one HTTP request! @igrigorik
Set the Etag class ProductsController < ApplicationController # GET /products def index @products = Product.limit(25) ! fresh_when :etag => [current_user, @products.order(:updated_at).last] end ! [...]
Set the Etag class ProductsController < ApplicationController # GET /products def index @products = Product.limit(25) ! fresh_when :etag => [current_user, @products.order(:updated_at).last] end ! [...]
Add caches_page to your controller to save views as static gz files in your public directory: ! caches_page :index, :show, :gzip => :true Add gem actionpack-page_caching for Rails 4.0
To setup a complex page_cache system is a lot of work. You have to tackle not only Rails but Nginx too. It does increase the snappiness of your application but might not be worth the effort for small systems.
I N L I N I N G • Es kann Sinn machen CSS und JavaScript in die HTML- Seite zu packen. • Beispiele: • Sehr wenig CSS oder JavaScript. • Schnelle Ladezeit bei der ersten Seite. • Einsatz von TurboLinks.
I N L I N I N G V O N B I L D E R N Auch das kann Sinn machen. Man sollte aber hier darauf achten, wie lange der Browser braucht das Bild zu „entpacken“. Auf langsamen Geräten kann das länger dauern, als der Download einer eigenen Datei. ! Vorsicht!
http://www.chromium.org/developers/design-documents/dns-prefetching ! „Most common names like google.com and yahoo.com are resolved so often that most local ISP's name resolvers can answer in closer to 80-120ms. If the domain name in question is an uncommon name, then a query may have to go through numerous resolvers up and down the hierarchy, and the delay can average closer to 200-300ms.“
P R E F E T C H ! http://www.whatwg.org/specs/web-apps/current-work/#link-type-prefetch ! „The prefetch keyword indicates that preemptively fetching and caching the specified resource is likely to be beneficial, as it is highly likely that the user will require this resource.“ T I P P : " ACCEPT-RANGES: BYTES“ H E A D E R
wintermeyer
ramimac
tkmnzm
opeonikute
eiki
nishiharatsubasa
nrryuya
1ftseabass
autifyhq
nagiss
keio_smilab
bonotake
yukihiromori
smashingmag
chriscoyier
shlominoach
denniskardys
ufuk
garrettdimon
kevinliebholz
eileencodes
morganepeng
bkeepers
productmarketing
tenderlove