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

Browser Performance 101

Avatar for Albert Casademont Albert Casademont
October 31, 2014
Programming
0
140

Browser Performance 101

An introductory talk to the browser performance world for the nice people at Trovit

Avatar for Albert Casademont

Albert Casademont

October 31, 2014
Tweet

More Decks by Albert Casademont

See All by Albert Casademont
React PHP & Symfony @ SymfonyCat 2016
Avatar for Albert Casademont acasademont
2
920
PHP7 & Symfony 2 @ Symfony Barcelona May meetup
Avatar for Albert Casademont acasademont
2
600
PHP7 @ PHP Day Spain 2015
Avatar for Albert Casademont acasademont
5
6.3k
Doctrine in 90 minutes
Avatar for Albert Casademont acasademont
0
1.4k
SSL & Symfony
Avatar for Albert Casademont acasademont
0
360

Other Decks in Programming

See All in Programming
MCPで実現するAIエージェント駆動のNext.jsアプリデバッグ手法
Avatar for NakamuraTakumi nyatinte
6
840
TanStack DB ~状態管理の新しい考え方~
Avatar for じょうげん bmthd
2
330
フロントエンドのmonorepo化と責務分離のリアーキテクト
Avatar for Takuma Kajikawa kajitack
2
140
【第4回】関東Kaggler会「Kaggleは執筆に役立つ」
Avatar for Wataru Takahara mipypf
0
770
学習を成果に繋げるための個人開発の考え方 〜 「学習のための個人開発」のすすめ / personal project for leaning
Avatar for panda_program panda_program
1
110
Google I/O recap web編 大分Web祭り2025
Avatar for kponda kponda
0
2.9k
Portapad紹介プレゼンテーション
Avatar for KAKERU gotoumakakeru
1
130
Understanding Ruby Grammar Through Conflicts
Avatar for yui-knk yui_knk
1
120
モバイルアプリからWebへの横展開を加速した話_Claude_Code_実践術.pdf
Avatar for Kazuya Sakamoto kazuyasakamoto
0
260
WebAssemblyインタプリタを書く ～Component Modelを添えて～
Avatar for ruccho ruccho
1
910
コンテキストエンジニアリング Cursor編
Avatar for kinopee kinopeee
1
700
Introduction to Git & GitHub
Avatar for Latte72 latte72
0
120

Featured

See All Featured
CSS Pre-Processors: Stylus, Less & Sass
Avatar for Bermon Painter bermonpainter
358
30k
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
9
780
Visualization
Avatar for Eitan Lees eitanlees
147
16k
Fireside Chat
Avatar for paigeccino paigeccino
39
3.6k
Producing Creativity
Avatar for Steve Smith orderedlist
PRO
347
40k
Building a Modern Day 
E-commerce SEO Strategy
Avatar for Aleyda Solis aleyda
43
7.5k
Easily Structure & Communicate Ideas using Wireframe
Avatar for Afnizar Nur Ghifari afnizarnur
194
16k
Helping Users Find Their Own Way: Creating Modern Search Experiences
Avatar for Dan Newman danielanewman
29
2.8k
Unsuck your backbone
Avatar for Amy Palamountain ammeep
671
58k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
Avatar for mongodb mongodb
48
9.6k
4 Signs Your Business is Dying
Avatar for Josh Pigford shpigford
184
22k
GraphQLとの向き合い方2022年版
Avatar for Yosuke Kurami quramy
49
14k

Transcript

  1. Browser Perf 101

  2. About Albert Casademont ulabox.com @acasademont (no me busquéis en Linkedin)

  3. why perf matters?

  4. speed = money

  5. None

  6. but i'm a developer!

  7. DevOps

  8. source: wikipedia.org

  9. None

  10. 3-way TCP handshake source: http://www.admin-magazine.com

  11. TCP Flow control source: High Performace Networking (I. Grigorik)

  12. Performance check-list low latency is king! keep-alive initcwnd >= 10

    disable slow start after idle tcp fast open (kernel >= 3.6)
  13. None

  14. critical rendering path

  15. critical rendering path source: http://http://www.sitepoint.com

  16. critical rendering path source: http://http://www.sitepoint.com

  17. Performance check-list cache! keep bytes low (minimize, gzip) inline above

    the fold css make async js when possible lazy-load below the fold images
  18. None

  19. https = http + tls

  20. TLS Handshake source: https://devcentral.f5.com/articles/ssl-profiles-part-1

  21. None

  22. SPDY HTTP 2.0

  23. GoogleBot HTTPS

  24. None

  25. http vs NICE https

  26. Resources

  27. Resources http://www.webpagetest.org https://blog.cloudflare.com https://igvita.com https://insouciant.org https://imperialviolet.org https://ssllabs.com/ssltest

  28. gràcies ;)