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

How to improve the performance of your website ...

Avatar for Thijs Feryn Thijs Feryn
December 08, 2015
Technology
360
0

How to improve the performance of your website - FeWeb15

Web performance talk for FeWeb Congress edition 2015

Avatar for Thijs Feryn

Thijs Feryn

December 08, 2015

More Decks by Thijs Feryn

See All by Thijs Feryn
Caching the uncacheable with Varnish - PHP London 2020
Avatar for Thijs Feryn thijsferyn
0
530
Accelerating OTT video platforms with Varnish - London Video Tech meetup 2020
Avatar for Thijs Feryn thijsferyn
0
460
't Oncachebare cachen
Avatar for Thijs Feryn thijsferyn
0
460
Caching the uncacheable with Varnish - PHP UG FFM 19
Avatar for Thijs Feryn thijsferyn
1
930
Developing cacheable PHP applications - PHP Barcelona 2019
Avatar for Thijs Feryn thijsferyn
0
730
Caching the uncacheable with Varnish - FullstackEU 2019
Avatar for Thijs Feryn thijsferyn
0
560
Varnish beyond basic web acceleration - Symfony Live Berlin 2019
Avatar for Thijs Feryn thijsferyn
0
480
Developing cacheable PHP applications
Avatar for Thijs Feryn thijsferyn
0
530
Varnish beyond basic web acceleration - DAHO.AM 2019
Avatar for Thijs Feryn thijsferyn
0
510

Other Decks in Technology

See All in Technology
GoとSIMDとWasmの今。
Avatar for asuka askua
3
460
『家族アルバム みてね』における インシデント対応との向き合い方 / Approach incident response in Family Album
Avatar for kohbis kohbis
2
290
「速く作る」から「正しく作る」へ ─ 生成AI時代の開発フロー改革の ロードマップと実行 ─
Avatar for starfish719 starfish719
0
360
大学生が本気でDatabricksを活用してDiscordサークルをデータ駆動させてみた
Avatar for Kazuki Date phantomjuju
1
320
AI駆動開発が変える、大規模開発の前提 ーHuman in the Loop から Human on the Loop へ / AIE2026
Avatar for Visional Engineering ＆ Design visional_engineering_and_design
2
760
Sony_KMP_Journey_KotlinConf2026
Avatar for ソニー株式会社 sony
2
200
Diagnosing performance problems without the guesswork
Avatar for Elena Tanasoiu elenatanasoiu
0
150
AI時代の私の技術インプットとアウトプット術
Avatar for tonkotsuboy_com tonkotsuboy_com
15
8.2k
Claude code Orchestra
Avatar for Taisei Ozaki ozakiomumkj
3
890
AI活用を推進するために ファインディが下した、一つの小さな決断
Avatar for starfish719 starfish719
0
120
Platform engineering for developers, architects & the rest of us (AI agents)
Avatar for danielbryantuk danielbryantuk
0
170
Cloud Run のアップデート 触ってみる＆紹介
Avatar for Gre212 gre212
0
290

Featured

See All Featured
brightonSEO & MeasureFest 2025 - Christian Goodrich - Winning strategies for Black Friday CRO & PPC
Avatar for Christian Goodrich cargoodrich
3
720
Making the Leap to Tech Lead
Avatar for Ryan Cromwell cromwellryan
135
9.9k
Code Reviewing Like a Champion
Avatar for maltzj maltzj
528
40k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
Avatar for Sam Stephenson sstephenson
162
16k
Heart Work Chapter 1 - Part 1
Avatar for Lake Fama lfama
PRO
7
36k
How to make the Groovebox
Avatar for あそなす asonas
2
2.2k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
Avatar for Michelle Schulp Hunt marktimemedia
31
2.8k
YesSQL, Process and Tooling at Scale
Avatar for Rocio Delgado rocio
174
15k
Efficient Content Optimization with Google Search Console & Apps Script
Avatar for Katarina Dahlin katarinadahlin
PRO
1
590
Mind Mapping
Avatar for Hélio Medeiros helmedeiros
PRO
1
220
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
Avatar for Vitaly Friedman smashingmag
254
22k
The Art of Programming - Codeland 2020
Avatar for Erika Heidi erikaheidi
57
14k

Transcript

  1. By Thijs Feryn How to improve the performance of your

    website

  2. Hi, I’m Thijs

  3. I’m @ThijsFeryn on Twitter

  4. I’m an Evangelist At

  5. I’m a at board member

  6. Web performance is an essential part of the user experience

  7. Infrastructure

  8. Code

  9. Browser rendering

  10. User location

  11. Down Slowdown ~ downtime

  12. Focus on the foundation first

  13. Fast servers

  14. Performance != Scalability

  15. Performance: speed

  16. Scalability: constant speed with increasing load

  17. Add servers to maintain performance

  18. Stability

  19. Code efficiently

  20. Identify slowest part

  21. Optimize database

  22. Optimize runtime

  23. After a while you hit the limits

  24. Don’t recompute if the data hasn’t changed

  25. Cache

  26. Memcached Redis APC

  27. None

  28. Optimize database Optimize runtime A void A void

  29. Don’t recompute if the data hasn’t changed

  30. Varnish

  31. Normally User Server

  32. With Varnish User Varnish Server

  33. Caching in your architecture

  34. Respect HTTP

  35. Cache-control: public, max- age=3600, s-maxage=7200 Cache-control: no-cache, no- store VS

  36. Cookies?

  37. Edge Side Includes

  38. None

  39. Don’t cache header

  40. Cache footer until 31/12/2015 23:59:59

  41. Cache for a day

  42. Cache for an hour

  43. <!DOCTYPE html> <html> <head> <title>The Demo</title> <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="stylesheet" href="/css/bootstrap.min.css"> <link rel="stylesheet" href="/css/bootstrap-theme.min.css"> <script src=“/js/jquery-2.1.4.min.js"></script> <script src="/js/bootstrap.min.js"></script> </head> <body> <nav class="navbar navbar-inverse navbar-fixed-top"> <esi:include src=“http://mysite.dev/nav" /> </nav> <div class="jumbotron"> <esi:include src="http://mysite.dev/jumbotron" /> </div> <div class="container"> {% block content %}{% endblock %} <hr> <footer> <esi:include src="http://mysite.dev/footer" /> </footer> </div> </body> </html> ESI tags

  44. Hit rate

  45. Browser rendering

  46. ✓Concurrency limitations ✓Slowband, bad mobile connection ✓First byte time ✓Rendering

    time ✓Limit resource size ✓Limit resource amount ✓Re-use TCP connections

  47. Compress images, JS & CSS

  48. Combine multiple JS & CSS into one file

  49. Right image size for the right device

  50. Non- blocking Javascript

  51. Google PageSpeed Insights & Web Page Performance Test

  52. User location

  53. Caching in the edge

  54. Content Delivery Network

  55. Faster responses per request

  56. Don’t saturate your own network

  57. None
  58. None
  59. None