Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Caching mit Contao 4.8 für AnwenderInnen

Yanick Witschi
October 10, 2019
Technology
1
330

Caching mit Contao 4.8 für AnwenderInnen

Wer den contao.org-Blog ein bisschen verfolgt, wird bereits wissen, dass sich mal wieder einiges in Sachen Caching ändert ab Contao 4.8.

Gemeinsam lernen wir nochmal die Basics von HTTP-Caching, die wichtigsten Header, die neuen Einstellungsmöglichkeiten ab Contao 4.8 und die Unterschiede zu Contao 4.4. Wir schauen uns an, wie ihr das Maximum an Speed aus eurer Contao-Installation herausholen könnt, wieso cachen manchmal nicht möglich ist und wie ihr herausfindet, ob ein Eintrag überhaupt aus dem Cache kommt. Ausserdem wagen wir einen kleinen Blick über den Tellerrand und schauen, welche Tools es denn noch gäbe um die Performance weiter zu verbessern, wenn es das Projekt-Budget erlaubt ;-)

Yanick Witschi

October 10, 2019
Tweet

More Decks by Yanick Witschi

See All by Yanick Witschi
Unicode: Die Vielf�ltigkeit von Zeichen und Symbolen
toflar
0
5
Asynchrone Kommunikation mit der Symfony Messenger-Komponente
toflar
0
170
The Long Journey Of Making Composer Memory-efficient and Fast
toflar
0
220
Keynote Contao Agenturtag 2020
toflar
1
1.6k
Http Cache - Muss es immer gleich Varnish sein?
toflar
0
69
HTTP Caching - Der Gigant unter den Caches
toflar
0
89
Git und GitHub für Nicht-Entwickler
toflar
2
470

Other Decks in Technology

See All in Technology
複雑なState管理からの脱却
sansantech
PRO
1
150
Exadata Database Service on Dedicated Infrastructure(ExaDB-D) UI スクリーン・キャプチャ集
oracle4engineer
PRO
2
3.2k
信頼性に挑む中で拡張できる・得られる１人のスキルセットとは？
ken5scal
2
530
AWS Media Services 最新サービスアップデート 2024
eijikominami
0
200
BLADE: An Attempt to Automate Penetration Testing Using Autonomous AI Agents
bbrbbq
0
310
マルチモーダル / AI Agent / LLMOps 3つの技術トレンドで理解するLLMの今後の展望
hirosatogamo
37
12k
生成AIが変えるデータ分析の全体像
ishikawa_satoru
0
130
ISUCONに強くなるかもしれない日々の過ごしかた/Findy ISUCON 2024-11-14
fujiwara3
8
870
The Role of Developer Relations in AI Product Success.
giftojabu1
0
120
EventHub Startup CTO of the year 2024 ピッチ資料
eventhub
0
120
マルチプロダクトな開発組織で 「開発生産性」に向き合うために試みたこと / Improving Multi-Product Dev Productivity
sugamasao
1
310
OCI Network Firewall 概要
oracle4engineer
PRO
0
4.1k

Featured

See All Featured
Build your cross-platform service in a week with App Engine
jlugia
229
18k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
25
1.8k
The Power of CSS Pseudo Elements
geoffreycrofte
73
5.3k
Git: the NoSQL Database
bkeepers
PRO
427
64k
A Philosophy of Restraint
colly
203
16k
Happy Clients
brianwarren
98
6.7k
Designing for humans not robots
tammielis
250
25k
Large-scale JavaScript Application Architecture
addyosmani
510
110k
Bootstrapping a Software Product
garrettdimon
PRO
305
110k
Teambox: Starting and Learning
jrom
133
8.8k
Facilitating Awesome Meetings
lara
50
6.1k
ピンチをチャンスに：未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
109
49k

Transcript

  1. terminal42 web development gmbh für AnwenderInnen Caching mit Contao 4.8

    Contao Konferenz 2019

  2. terminal42 web development gmbh contao/core-bundle (pre Monorepo) ⁃ 576 ⁃

    577 ⁃ 742 ⁃ 743 ⁃ 1263 ⁃ 1388 (leofeyer) ⁃ 1478 ⁃ 1611 ⁃ 1612 ⁃ 1630 (aschempp) Warum ich? • Der erste Pull Request im Bezug auf Caching auf den Monat genau vor 3 Jahren. Damals Contao 4.3. friendsofsymfony/http-cache ⁃ 373 ⁃ 419 ⁃ 422 ⁃ 423 ⁃ 437 friendsofsymfony/http-cache-bundle ⁃ 363 ⁃ 435 toflar/psr6-symfony-http-cache-store ⁃ 45 Commits seit 27.09.2017 symfony/symfony ⁃ 22079 (ausi) ⁃ 24075 ⁃ 25583 ⁃ 26532 (aschempp) ⁃ 27309 ⁃ 32455 contao/contao ⁃ 117 ⁃ 137 ⁃ 147 ⁃ 148 ⁃ 173 ⁃ 351 ⁃ 365 ⁃ 389 ⁃ 469 (ausi) ⁃ 482 ⁃ 483 (aschempp) ⁃ 592 (aschempp) ⁃ 611

  3. terminal42 web development gmbh Für AnwenderInnen? • Nicht für EndanwenderInnen,

    die den Inhalt bearbeiten. • Sondern für fortgeschriCene Contao- Administratoren, die die Webseite betreuen. • = Es wird technisch, aber ihr wollt ja auch etwas mehr wissen, als die EndanwenderInnen! :-)

  4. terminal42 web development gmbh Es ändert sich doch eh wieder!

    • NEIN! • Okay, die einzige Konstante ist der Wandel aber… • …zum ersten Mal so richGg happy mit dem was wir haben! • …keine Änderungen für die 4.9 in Aussicht was das Handling nach aussen hin angeht. • …bestes Caching-Framework aller CMSe dieser Welt! • ✏

  5. terminal42 web development gmbh Back to the basics

  6. terminal42 web development gmbh Back to the basics

  7. terminal42 web development gmbh Request GET /de/ HTTP/1.1 Cookie: PHPSESSID=……

    Host: contao.org Connection: close User-Agent: Mozilla/5.0 (…) Gecko/20100101 Firefox/69.0 Accept: text/html

  8. terminal42 web development gmbh Response HTTP/2.0 200 OK Date: Thu,

    09 Oct 2019 12:42:00 GMT Content-Length: 88 Content-Type: text/html Cache-Control: no-cache <html> <body> <h1>Hello, World!</h1> </body> </html>

  9. terminal42 web development gmbh Browser Server Private Cache Browser Private

    Cache

  10. terminal42 web development gmbh Browser Server Private Cache Browser Private

    Cache Proxy Shared/Public Cache

  11. terminal42 web development gmbh KonfiguraGon in Contao

  12. terminal42 web development gmbh HTTP/2.0 200 OK Date: Thu, 09

    Oct 2019 12:42:00 GMT Content-Length: 88 Content-Type: text/html Cache-Control: private, max-age=1800
 Vary: Cookie <html> <body> <h1>Hello, World!</h1> </body> </html>

  13. terminal42 web development gmbh HTTP/2.0 200 OK Date: Thu, 09

    Oct 2019 12:42:00 GMT Content-Length: 88 Content-Type: text/html Cache-Control: public, s-maxage=3600, max-age=1800 Vary: Cookie <html> <body> <h1>Hello, World!</h1> </body> </html>

  14. terminal42 web development gmbh HTTP/2.0 200 OK Date: Thu, 09

    Oct 2019 12:42:00 GMT Content-Length: 88 Content-Type: text/html Cache-Control: public, s-maxage=3600, max-age=1800 Vary: Cookie <html> <body> <h1>Hello, World!</h1> </body> </html>

  15. terminal42 web development gmbh That’s it! für die EndanwenderInnen

  16. terminal42 web development gmbh Warum überhaupt ein Cache? • Leistung

    (CPU, RAM) kostet immer weniger. • PHP OPCache wird immer besser. • «Mein Contao ist doch auch ohne Cache schnell!»

  17. terminal42 web development gmbh Performance! • Auch wenn der Server

    schnell ist: • Contao Boot-Prozess • Rou_ng (zu welcher Seite gehört die URL) • Datenbankabfragen für Seiten, Ar_kel, Module, Inhaltselemente • Template Rendering • Performance is about conversion rates and SEO
 (PageSpeed, Lighthouse, …) • Performance is about UX! Performance is about the users!

  18. terminal42 web development gmbh

  19. terminal42 web development gmbh Wozu der Umbau? Der eingebaute HTML-Cache

    in der 3.5 war doch okay?

  20. terminal42 web development gmbh Standards sind toll! • Masseinheiten •

    DIN • ISO • RFC

  21. terminal42 web development gmbh Browser Server Browser Proxy

  22. terminal42 web development gmbh Browser Server Browser Proxy

  23. terminal42 web development gmbh Browser Server Browser Proxy

  24. terminal42 web development gmbh Browser Server Browser Proxy Proxy Proxy

  25. terminal42 web development gmbh Browser Server Browser Proxy Proxy Proxy

    Proxy

  26. terminal42 web development gmbh

  27. terminal42 web development gmbh Der Shared Cache ist worüber wir

    heute sprechen!

  28. terminal42 web development gmbh

  29. terminal42 web development gmbh Nicht cachebar HTTP/2.0 200 OK Date:

    Thu, 09 Oct 2019 12:42:00 GMT Content-Length: 88 Content-Type: text/html Contao-Cache: miss Age: 0 <html> <body> <h1>Hello, World!</h1> </body> </html>

  30. terminal42 web development gmbh Wird neu gecached HTTP/2.0 200 OK

    Date: Thu, 09 Oct 2019 12:42:00 GMT Content-Length: 88 Content-Type: text/html Contao-Cache: miss/store Age: 0 <html> <body> <h1>Hello, World!</h1> </body> </html>

  31. terminal42 web development gmbh Aus dem Cache HTTP/2.0 200 OK

    Date: Thu, 09 Oct 2019 12:42:00 GMT Content-Length: 88 Content-Type: text/html Contao-Cache: fresh Age: 42 <html> <body> <h1>Hello, World!</h1> </body> </html>

  32. terminal42 web development gmbh ProblemaGk #1 Wie erkennen wir ob

    ein Benutzer eingeloggt ist?

  33. terminal42 web development gmbh Problemstellung • Contao muss dem Cache

    mifeilen können, dass er hfps:/ /www.domain.de/login.html anders cachen soll, je nach dem ob ich eingeloggt bin oder nicht. Ansonsten würde immer das Login-Formular angezeigt, staf «eingeloggt als k.jones».

  34. terminal42 web development gmbh Der Vary-Header • Teilt dem Cache

    mit, unterschiedliche Varianten pro URI abzulegen. • Man merke sich: «Hallo Cache, bife vary-iere» $

  35. terminal42 web development gmbh Der Vary-Header GET /hello-world Accept: text/html

    HTTP/2.0 200 OK Cache-Control: public, s-maxage=300 Vary: Accept <html> <body> <h1>Hello, World!</h1> </body> </html> Ich darf diesen Eintrag für 300 Sekunden cachen, aber nur dann ausliefern, wenn der Request den Header «Accept» mit dem exakten (!) Inhalt «text/html» enthält!

  36. terminal42 web development gmbh Der Vary-Header GET /hello-world Accept: application/json

    HTTP/2.0 200 OK Cache-Control: public, s-maxage=300 Vary: Accept { “body”: “Hello World!” } Ich darf diesen Eintrag für 300 Sekunden cachen, aber nur dann ausliefern, wenn der Request den Header «Accept» mit dem exakten (!) Inhalt «application/json» enthält!

  37. terminal42 web development gmbh Nicht eingeloggt GET /hello-world Accept: text/html

    HTTP/2.0 200 OK Cache-Control: public, s-maxage=300 Vary: Cookie

  38. terminal42 web development gmbh Eingeloggt GET /hello-world Accept: text/html Cookie:

    PHPSESSID=b7a861e4ae0664b3a82ec2fbf239e5ff HTTP/2.0 200 OK Cache-Control: private, no-store Vary: Cookie

  39. terminal42 web development gmbh HTTP/2.0 200 OK Date: Thu, 09

    Oct 2019 12:42:00 GMT Content-Length: 88 Content-Type: text/html Cache-Control: public, s-maxage=3600, max-age=1800 Vary: Cookie <html> <body> <h1>Hello, World!</h1> </body> </html> Nicht eingeloggt

  40. terminal42 web development gmbh ProblemaGk #2 Frontend-Vorschau

  41. terminal42 web development gmbh Die preview.php • web/index.php • web/preview.php

    • Frontend-Vorschau:
 hfps:/ /www.domain.de/preview.php/profil.html

  42. terminal42 web development gmbh ProblemaGk #3 Cookies

  43. terminal42 web development gmbh ProblemaGk • Vary bezieht sich immer

    auf den Header und dessen gesamten Inhalt. • Sowas wie «Vary: Cookie=PHPSESSID» exis_ert nicht. • (es gab mal einen Key-Header Draj der das ändern sollte aber dieser hat es leider nie über den Draj-Status hinaus geschal…) • Ergo: Wir können nicht auf bes_mmte Cookies vary-en. Der Cache ist somit nicht in der Lage irrelevante von relevanten Cookies zu unterscheiden. Caching wird somit deakGviert, sobald mindestens ein Cookie vorhanden ist! • irrelevant = hat keinen Einfluss auf den Cache und soll somit eigentlich nicht berücksich_gt werden. • relevant = hat Einfluss auf den Cache und soll berücksich_gt werden.

  44. terminal42 web development gmbh Irrelevante Cookies? • GDPR-Cookiebar, die am

    HTML nichts ändert • Google Analy_cs • Matomo (Piwik) • Facebook Pixel • Cloudflare • uvm.

  45. terminal42 web development gmbh Lösung • Blacklist, Contao kennt eine

    interne Liste an irrelevanten Cookies und löscht diese bevor der Cache gefragt wird. (siehe «StripCookiesSubscriber») • '(.*)?modal(.*)?' • '_ga' • '_pk_id' • '_rp' • Whitelist, kann per Umgebungsvariable konfiguriert werden und übersteuert die mitgelieferte Blacklist.

  46. terminal42 web development gmbh

  47. terminal42 web development gmbh Informiert die Entwickler • Cookies werden

    zu 90%* falsch eingesetzt! • Wenn der Server die Informa_on nicht verwertet, braucht es kein Cookie! Teilt ihm keine Informa_onen mit, die er nicht gebrauchen kann! • JavaScript kann sessionStorage, localStorage (Vorsicht: blocking API, also synchron) oder IndexedDB nutzen! • Meinen Blogpost lesen: hfps:/ /contao.org/de/news/ die-jagd-auf-ueberfluessige-cookies.html * Yanick’sche Sta_s_k

  48. terminal42 web development gmbh Relevante Cookies? • PHPSESSID (PHP Session)

    • Potenziell persönliche Daten (Session !== eingeloggt als User) • CSRF-Schutz • A/B-Tes_ng • Google Analy_cs Daten werden vom Server ausgewertet

  49. terminal42 web development gmbh Whitelist • Entweder als echte Umgebungsvariable

    • Oder .env-Datei im Wurzelverzeichnis COOKIE_WHITELIST=PHPSESSID,csrf_https-contao_csrf_token

  50. terminal42 web development gmbh Bonus 1 Performance-Vergleiche

  51. terminal42 web development gmbh Eingebauter Cache

  52. terminal42 web development gmbh Varnish

  53. terminal42 web development gmbh Bonus 2 Das beste Caching-Framework!

  54. terminal42 web development gmbh Browser Server Browser Proxy Bekannte Server

    / Zugriff möglich Unbekannte Clients / Zugriff nicht möglich

  55. terminal42 web development gmbh Browser Server Browser Proxy Unbekannte Clients

    / Zugriff nicht möglich Bekannte Server / Zugriff möglich

  56. terminal42 web development gmbh Cache Tagging HTTP/2.0 200 OK Date:

    Thu, 09 Oct 2019 12:42:00 GMT Content-Length: 88 Content-Type: text/html Cache-Control: public, s-maxage=1800
 X-Cache-Tags: contao.db.tl_article.489,contao.db.tl_content.2180,contao.db.tl_content. 2182,contao.db.tl_content.2184,contao.db.tl_content.2186,contao.db.tl_content. 2185,contao.db.tl_content.2183,contao.db.tl_content.2181,contao.db.tl_module. 489,contao.db.tl_module.,contao.db.tl_article.386,contao.db.tl_content. 793,contao.db.tl_content.779,contao.db.tl_content.781,contao.db.tl_content. 783,contao.db.tl_content.782,contao.db.tl_content.784,contao.db.tl_content. 780,contao.db.tl_content.785,contao.db.tl_content.786,contao.db.tl_content. 794,contao.db.tl_content.791,contao.db.tl_content.787,contao.db.tl_content. 792,contao.db.tl_module.386,contao.db.tl_article.387,contao.db.tl_content. 795,contao.db.tl_content.797,contao.db.tl_content.801,contao.db.tl_content. 802,contao.db.tl_module.2,contao.db.tl_content.798,contao.db.tl_content. 799,contao.db.tl_content.803,contao.db.tl_content.800,contao.db.tl_content. 796,contao.db.tl_module.387,contao.db.tl_page.22 <html> <body> <h1>Hello, World!</h1> </body> </html>

  57. terminal42 web development gmbh Cache Tag Purging Server Proxy PURGE

    / HTTP/1.1 Host: localhost X-Cache-Tags: contao.db.tl_content.42

  58. terminal42 web development gmbh Contao IntegraGon • Sendet beim Edi_eren

    automa_sch Cache-Tag-Invalida_on- Requests nach dem Schema • contao.db.<Tabelle> • contao.db.<Tabelle>.<ID> • Erweiterbar durch den «oninvalidate_cache_tags_callback» • Beispielsweise invalidiert das «comments-bundle» beim Edi_eren eines Kommentars die Tags der Quelle. • Tagging im Frontend ist Aufgabe des Entwicklers

  59. terminal42 web development gmbh Video Demo

  60. terminal42 web development gmbh FOSHCpCache(Bundle) • Symfony HfpCache mit toflar/psr6-symfony-hfp-

    cache-store • Varnish • erweiterbar, PR’s offen für • OpenLiteSpeed • Fastly

  61. terminal42 web development gmbh

  62. terminal42 web development gmbh Zusammenfassung • Contao 4.8 enthält -

    abgesehen von «der Checkbox»™ - die gleichen Cache- Einstellungsmöglichkeiten wie Contao 4.4, aber… • …wir sind 100% standardkonform! • …wir sind schneller out-of-the-box! • …wir bieten ein Meer an Möglichkeiten das Setup noch schneller zu machen!

  63. terminal42 web development gmbh ? Contao Konferenz 2019

  64. terminal42 web development gmbh Kontakt • Yanick Witschi / terminal42

    gmbh • Contao Core Entwickler • API's, Performance, Caching • Tennis, Basketball, Faustball • Scotch • @toflar