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
0
330

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
Tweet

More Decks by Thijs Feryn

See All by Thijs Feryn
Caching the uncacheable with Varnish - PHP London 2020
Avatar for Thijs Feryn thijsferyn
0
440
Accelerating OTT video platforms with Varnish - London Video Tech meetup 2020
Avatar for Thijs Feryn thijsferyn
0
390
't Oncachebare cachen
Avatar for Thijs Feryn thijsferyn
0
380
Caching the uncacheable with Varnish - PHP UG FFM 19
Avatar for Thijs Feryn thijsferyn
1
740
Developing cacheable PHP applications - PHP Barcelona 2019
Avatar for Thijs Feryn thijsferyn
0
660
Caching the uncacheable with Varnish - FullstackEU 2019
Avatar for Thijs Feryn thijsferyn
0
480
Varnish beyond basic web acceleration - Symfony Live Berlin 2019
Avatar for Thijs Feryn thijsferyn
0
400
Developing cacheable PHP applications
Avatar for Thijs Feryn thijsferyn
0
440
Varnish beyond basic web acceleration - DAHO.AM 2019
Avatar for Thijs Feryn thijsferyn
0
420

Other Decks in Technology

See All in Technology
AIエージェント開発用SDKとローカルLLMをLINE Botと組み合わせてみた / LINEを使ったLT大会 #14
Avatar for you（@youtoy） you
PRO
0
130
Aurora DSQLはサーバーレスアーキテクチャの常識を変えるのか
Avatar for TomoyaIwata iwatatomoya
1
1.2k
TS-S205_昨年対比2倍以上の機能追加を実現するデータ基盤プロジェクトでのAI活用について
Avatar for K.Mitsuhashi kaz3284
1
230
初めてAWSを使うときのセキュリティ覚書〜初心者支部編〜
Avatar for cm-usuda-keisuke cmusudakeisuke
1
280
いま注目のAIエージェントを作ってみよう
Avatar for Marimo supermarimobros
0
360
MagicPod導入から半年、オープンロジQAチームで実際にやったこと
Avatar for joko tjoko
0
110
Apache Spark もくもく会
Avatar for Takaaki Yayoi taka_aki
0
140
IoT x エッジAI - リアルタイ ムAI活用のPoCを今すぐ始め る方法 -
Avatar for niizawat niizawat
0
120
OCI Oracle Database Services新機能アップデート(2025/06-2025/08)
Avatar for oracle4engineer oracle4engineer
PRO
0
180
テストを軸にした生き残り術
Avatar for KNOWLEDGE WORK / 株式会社ナレッジワーク kworkdev
PRO
0
220
「全員プロダクトマネージャー」を実現する、Cursorによる仕様検討の自動運転
Avatar for Michiru Kato applism118
22
12k
2つのフロントエンドと状態管理
Avatar for MIXI ENGINEERS mixi_engineers
PRO
3
160

Featured

See All Featured
Save Time (by Creating Custom Rails Generators)
Avatar for Garrett Dimon garrettdimon
PRO
32
1.6k
A designer walks into a library…
Avatar for Paul Jervis Heath pauljervisheath
207
24k
The Art of Delivering Value - GDevCon NA Keynote
Avatar for David Neal reverentgeek
15
1.7k
RailsConf 2023
Avatar for Aaron Patterson tenderlove
30
1.2k
Making Projects Easy
Avatar for Brett Harned brettharned
117
6.4k
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
9
810
Become a Pro
Avatar for Speaker Deck speakerdeck
PRO
29
5.5k
Code Reviewing Like a Champion
Avatar for maltzj maltzj
525
40k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
Avatar for Sam Stephenson sstephenson
162
15k
[RailsConf 2023] Rails as a piece of cake
Avatar for Vladimir Dementyev palkan
57
5.8k
Building Adaptive Systems
Avatar for Chris Keathley keathley
43
2.7k
A Tale of Four Properties
Avatar for Chris Coyier chriscoyier
160
23k

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