web performance

assets pipeline in Play 2.3

Speed is a feature

● Faster sites lead to better user engagement

● Faster sites lead to better user retention● Faster sites lead to higher conversions

Source: http://chimera.labs.oreilly.com/books/1230000000545/ch01.html#SPEED_FEATURE

better performance

● less bytes● less requests● less latency

less bytes (1)

● gzip encoding● doc:

https://www.playframework.com/documentation/latest/GzipEncoding

less bytes (2)

● conditional requests● Last-Modified and ETag headers provide

validation mechanisms

Last-Modified

● Server sets Last-Modified header● Last-Modified: Tue, 15 Nov 1994 12:45:26 GMT

● Browser issues an If-Modified-Since request header to validate the cached document

● Server answers with 304 Not Modified or 200 OK

Etag

● Server sets Etag header● Etag: "15f0fff99ed5aae4edffdd6496d7131f"

● Browser issues an If-None-Match request header to validate the cached document

● Server answers with 304 Not Modified or 200 OK

Conditional requests

● Last-modified: based on time

● Etag: based on content

● Since play 2.0.2

less requests

● Cache-Control switches on caching in the browser

● avoid requests

Cache-Control

● Cache-Control:public

● Cache-Control:private

● Cache-Control:public, max-age=31536000

● Cache-Control:public

Expires: Mon, 25 Jun 2012 21:31:12 GMT

real world

● Caching strategies different from browser to browser

perfect world

● in developement: always the last version● in production:

– cache the assets as long as they are not modified

– be sure that a browser does not use an outdated cached asset

play 2.3

● pipelineStages := Seq(digest, gzip)

● in production mode● content-based hash in the filename● different content -> different fingerprint● sets a very long cache

reduce latency

● Content delivery network (CDN)● distributes content around globe● location near from client● request without cookie● downside: one more DNS lookup

play 2.3

● webjars● pipelineStages := Seq(rjs, digest, gzip)

● assets from http://cdn.jsdelivr.net/

under the cover

● assets pipeline managed with sbt-web

and plugins: https://github.com/sbt/sbt-web

● not play specific● versioned assets controller in play 2.3

Code

https://github.com/leanovate/moodly

web perf - more info

● High Performance Browser Networkinghttp://chimera.labs.oreilly.com/books/1230000000545/index.html

● https://devcenter.heroku.com/articles/increasing-application-performance-with-http-cache-headers

● https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/http-caching