Slide 1

Slide 1 text

CACHING THE UNCACHEABLE BY THIJS FERYN WITH VARNISH

Slide 2

Slide 2 text

Slow websites SUCK

Slide 3

Slide 3 text

WEB PERFORMANCE IS AN ESSENTIAL PART OF THE USER EXPERIENCE

Slide 4

Slide 4 text

SLOW ~ DOWN

Slide 5

Slide 5 text

No content

Slide 6

Slide 6 text

No content

Slide 7

Slide 7 text

No content

Slide 8

Slide 8 text

THROWING SERVERS AT THE PROBLEM

Slide 9

Slide 9 text

MO' MONEY MO' SERVERS MO' PROBLEMS

Slide 10

Slide 10 text

IDENTIFY SLOWEST PARTS

Slide 11

Slide 11 text

OPTIMIZE

Slide 12

Slide 12 text

AFTER A WHILE YOU HIT THE LIMITS

Slide 13

Slide 13 text

CACHE

Slide 14

Slide 14 text

HI, I'M THIJS

Slide 15

Slide 15 text

I'M AN EVANGELIST AT

Slide 16

Slide 16 text

No content

Slide 17

Slide 17 text

No content

Slide 18

Slide 18 text

4,800,000 WEBSITES 19% OF THE TOP 10K WEBSITES

Slide 19

Slide 19 text

No content

Slide 20

Slide 20 text

I'M @THIJSFERYN

Slide 21

Slide 21 text

No content

Slide 22

Slide 22 text

No content

Slide 23

Slide 23 text

NORMALLY USER SERVER

Slide 24

Slide 24 text

WITH REVERSE CACHING PROXY USER PROXY SERVER

Slide 25

Slide 25 text

No content

Slide 26

Slide 26 text

No content

Slide 27

Slide 27 text

CONTROLLING THE CACHE WITH HTTP Expires: Sat, 09 Sep 2017 14:30:00 GMT Cache-control: public, max-age=3600, s-maxage=86400 Cache-control: private, no-cache, no-store Vary: Accept-Language

Slide 28

Slide 28 text

STATE

Slide 29

Slide 29 text

STATE ~ USER SPECIFIC DATA COOKIES AUTH HEADERS

Slide 30

Slide 30 text

FOR YOUR EYES ONLY NOT CACHED

Slide 31

Slide 31 text

VARNISH CONFIGURATION LANGUAGE

Slide 32

Slide 32 text

vcl 4.1; sub vcl_recv { if (req.http.Cookie) { set req.http.Cookie = ";" + req.http.Cookie; set req.http.Cookie = regsuball(req.http.Cookie, "; +", ";"); set req.http.Cookie = regsuball(req.http.Cookie, ";(SESS[a-z0-9]+|SSESS[a-z0-9]+|NO_CACHE)=", "; \1="); set req.http.Cookie = regsuball(req.http.Cookie, ";[^ ][^;]*", ""); set req.http.Cookie = regsuball(req.http.Cookie, "^[; ]+|[; ]+$", ""); if (req.http.Cookie == "") { unset req.http.Cookie; } else { return (pass); } } } Only keep certain cookies

Slide 33

Slide 33 text

sub vcl_recv { if (req.http.Cookie) { set req.http.Cookie = ";" + req.http.Cookie; set req.http.Cookie = regsuball(req.http.Cookie, "; +", ";"); set req.http.Cookie = regsuball(req.http.Cookie, ";(language)=", "; \1="); set req.http.Cookie = regsuball(req.http.Cookie, ";[^ ][^;]*", ""); set req.http.Cookie = regsuball(req.http.Cookie, "^[; ]+|[; ]+$", ""); if (req.http.cookie ~ "^\s*$") { unset req.http.cookie; return(pass); } return(hash); } } sub vcl_hash { hash_data(regsub( req.http.Cookie, "^.*language=([^;]*);*.*$", "\1" )); } Cookie cache variation

Slide 34

Slide 34 text

vcl 4.1; import cookieplus; sub vcl_recv { cookieplus.keep("language"); cookieplus.write(); } sub vcl_hash { hash_data(cookieplus.get("language")); } VMOD_COOKIE

Slide 35

Slide 35 text

CONTAINS USER INFORMATION

Slide 36

Slide 36 text

NO CACHE

Slide 37

Slide 37 text

PLACEHOLDERS

Slide 38

Slide 38 text

SEPARATE HTTP REQUEST

Slide 39

Slide 39 text

AJAX

Slide 40

Slide 40 text

✓CLIENT-SIDE ✓COMMON KNOWLEDGE ✓PARALLEL PROCESSING ✓GRACEFUL DEGRADATION -PROCESSED BY THE BROWSER -EXTRA ROUNDTRIPS -SOMEWHAT SLOWER AJAX

Slide 41

Slide 41 text

EDGE-SIDE INCLUDES ESI

Slide 42

Slide 42 text

Slide 43

Slide 43 text

ESI ✓ PLACEHOLDER ✓ PARSED BY VARNISH ✓ OUTPUT IS A COMPOSITION OF BLOCKS ✓ STATE PER BLOCK ✓ TTL PER BLOCK

Slide 44

Slide 44 text

sub vcl_recv { set req.http.Surrogate-Capability = "key=ESI/1.0"; } sub vcl_backend_response { if (beresp.http.Surrogate-Control ~ "ESI/1.0") { unset beresp.http.Surrogate-Control; set beresp.do_esi = true; } }

Slide 45

Slide 45 text

✓SERVER-SIDE ✓STANDARDIZED ✓PROCESSED ON THE “EDGE”, NOT IN THE BROWSER ✓GENERALLY FASTER -SEQUENTIAL* -ONE FAILS, ALL FAIL -LIMITED IMPLEMENTATION IN VARNISH -NOT THAT COMMON ESI PARALLEL IN ENTERPRISE

Slide 46

Slide 46 text

NON-CACHEABLE ROUTES WILL STILL BE A TARGET FOR LOAD/LATENCY

Slide 47

Slide 47 text

NOT JUST A CACHE NOT JUST "TAKE IT OR LEAVE IT"

Slide 48

Slide 48 text

AN HTTP LOGIC BOX

Slide 49

Slide 49 text

DECISION MAKING AT THE EDGE

Slide 50

Slide 50 text

vcl 4.1; import cookieplus; import redis; import synthbackend; sub vcl_init { new db = redis.db( location="redis:6379", type=master, connection_timeout=500, shared_connections=false, max_connections=1); } sub vcl_recv { set req.http.X-Login = "false"; set req.http.x-session = cookieplus.get("PHPSESSID","guest"); if(req.http.x-session != "guest") { db.command("EXISTS"); db.push("sf_s"+cookieplus.get("PHPSESSID")); db.execute(); if(db.get_integer_reply() == 1) { set req.http.X-Login = "true"; } } } SYNTHETIC HTTP

Slide 51

Slide 51 text

sub vcl_backend_fetch { if(bereq.url == "/session") { if(bereq.http.X-Login != "true") { set bereq.backend = synthbackend.from_string("{}"); return(fetch); } db.command("EVAL"); db.push({" local session = redis.call('GET', KEYS[1]) if session == nil then return '{}' end local result = string.gsub(session, '[%c]', '') local username = string.gsub(result,'.+Userusername\";s:[0-9]+:\"([^\"]+)\";.+','%1') if username == nil then return '{}' end return '{"username":"'.. username ..'"}' "}); db.push(1); db.push("sf_s"+cookieplus.get("PHPSESSID")); db.execute(); set bereq.backend = synthbackend.from_string(db.get_string_reply()); } } sub vcl_backend_response { if(bereq.url == "/session") { set beresp.http.Content-Type = "application/json; charset=utf-8"; set beresp.ttl = 3600s; set beresp.http.vary = "x-session"; } } REDIS LUA CODE

Slide 52

Slide 52 text

USER GET /session Cookie: PHPSESSID=7er3hjKal8u235c87u6ih0vz8Y HTTP/1.1 200 OK Content-Length: 31 Content-Type: application/json; charset=utf-8 X-Varnish: 163854 196622 Age: 27 {"username":"thijs"} VARNISH

Slide 53

Slide 53 text

WHAT DO YOU DO WITH IT? ✓ AJAX CALL ✓ LOAD VIA ESI AND PROCESS VIA LOCAL JAVASCRIPT ✓ EDGESTASH

Slide 54

Slide 54 text

{{ EDGESTASH }} VARNISH MODULE FOR MUSTACHE PROCESSING ON THE EDGE

Slide 55

Slide 55 text

vcl 4.1; import edgestash; backend default { .host = "1.1.1.1"; .port = "80"; } sub vcl_backend_response { if (bereq.url == "/session") { edgestash.index_json(); } else if (bereq.url == "/") { edgestash.parse_response(); } } sub vcl_deliver { if (req.url == "/" && edgestash.is_edgestash()) { edgestash.add_json_url("/session"); edgestash.execute(); } } EDGESTASH

Slide 56

Slide 56 text

EDGESTASH {"username":"Thijs"}
{{ username }}
Thijs

Slide 57

Slide 57 text

MORE FLEXIBILITY

Slide 58

Slide 58 text

Surrogate-Control: edgestash="EDGESTASH/2.1" Link: ; rel=edgestash

Slide 59

Slide 59 text

vcl 4.1; import edgestash; import std; backend default { .host = "1.1.1.1"; } sub vcl_recv { set req.http.Surrogate-Capability={"edgestash="EDGESTASH/2.1""}; } sub vcl_backend_response { if(beresp.http.Link) { std.collect(beresp.http.Link,","); } if(beresp.http.Link ~ "<([^>]+)>; rel=edgestash") { set beresp.http.x-edgestash-json-urls = regsuball(beresp.http.Link,"(?(?=<[^>]+>; rel=edgestash)<([^>]+)>; rel=edgestash|<([^>]+)>; rel=[a-z]+, )","\1"); } if(beresp.http.Surrogate-Control) { std.collect(beresp.http.Surrogate-Control); } if(beresp.http.Surrogate-Control ~ {".*="EDGESTASH/2\.[0-9]+".*"}) { edgestash.parse_response(); } } EDGESTASH

Slide 60

Slide 60 text

sub vcl_deliver { if(edgestash.is_edgestash() && resp.http.x-edgestash-json-urls) { edgestash.add_json_url_csv(resp.http.x-edgestash-json-urls); edgestash.execute(); } unset resp.http.Link; unset resp.http.x-edgestash-json-urls; unset resp.http.surrogate-control; } EDGESTASH

Slide 61

Slide 61 text

No content

Slide 62

Slide 62 text

COMPOSER REQUIRE THIJSFERYN/EDGESTASH-TWIG-BUNDLE

Slide 63

Slide 63 text

{{ edgestash('username','/session') }}
{{ username | edgestash('username','/session') }}

Slide 64

Slide 64 text

{% if isEdgestash() %} //Edgestash-supported logic {% else %} //Regular Twig logic {% endif %}

Slide 65

Slide 65 text

{{ edgestash('#username', '/session') }} Welcome {{ edgestash('username') }} {{ edgestash('/username') }} {{ edgestash('^username') }} Welcome guest {{ edgestash('/username') }

Slide 66

Slide 66 text

    {{ edgestash('#.', '/users') }}
  • {{ edgestash('username') }}
  • {{ edgestash('/.') }}

Slide 67

Slide 67 text

No content

Slide 68

Slide 68 text

FROM $0.20/H + 14 DAYS FREE TRIAL

Slide 69

Slide 69 text

MORE EDGE DECISION MAKING

Slide 70

Slide 70 text

import deviceatlas; sub vcl_recv { set req.http.MobilePhone = "no"; if (deviceatlas.lookup_int(req.http.User-Agent, "isMobilePhone")) { set req.http.MobilePhone = "yes"; } } Device detection

Slide 71

Slide 71 text

vcl 4.0; import mmdb; backend default { .host = "192.0.2.11"; .port = "8080"; } # create a database object sub vcl_init { new geodb = mmdb.init("/path/to/db"); } sub vcl_recv { # retrieve the name of the request's origin set req.http.Country-Name = geodb.country_name(client.ip); # if the country doesn't come from Germany or Belgium, deny access if (req.http.Country-Name != "Germany" || req.http.Country-Name != "Belgium") { return (synth(403, "Sorry, only available in Germany and Belgium")); } } Geo blocking

Slide 72

Slide 72 text

vcl 4.0; import http; backend default { .host = "origin"; .port = "80"; } sub vcl_recv { set req.http.X-prefetch = http.varnish_url("/"); } sub vcl_backend_response { if (beresp.http.Link ~ "<.+>.*(prefetch|next)") { set bereq.http.X-link = regsub(beresp.http.Link, "^.*<([^>]*)>.*$", "\1"); set bereq.http.X-prefetch = regsub(bereq.http.X-prefetch, "/$", bereq.http.X-link); http.init(0); http.req_copy_headers(0); http.req_set_url(0, bereq.http.X-prefetch); http.req_send_and_finish(0); } } Pre-fetching

Slide 73

Slide 73 text

No content

Slide 74

Slide 74 text

No content

Slide 75

Slide 75 text

HTTPS://FERYN.EU HTTPS://TWITTER.COM/THIJSFERYN HTTPS://INSTAGRAM.COM/THIJSFERYN