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

Cutting off the browser fat from your app

Avatar for Hector Bustillos Hector Bustillos
October 10, 2013
Technology
330
1

Cutting off the browser fat from your app

Avatar for Hector Bustillos

Hector Bustillos

October 10, 2013

More Decks by Hector Bustillos

See All by Hector Bustillos
Saving your Rails applications.
Avatar for Hector Bustillos hecbuma
1
110

Other Decks in Technology

See All in Technology
#jawssonic2026 あの時代が悪かった ~動かなかったSageMakerと共に迎えたイベント当日~
Avatar for Kana Kitagawa ktkn1129
0
130
Bet AI Day 2026丨Production-Ready AI Agents — エンタープライズの実務を任せるための設計と運用
Avatar for LayerX layerx
PRO
3
2.1k
ブラウザアプリの継続的パフォーマンスモニタリング (序) / Continuous Browser Application Performance Monitoring; Act 1
Avatar for moznion moznion
0
110
AIエージェントを雇う前に決める5つのこと
Avatar for 西岡 賢一郎 (Kenichiro Nishioka) knishioka
1
160
Where Is JetBrains AI Heading- — Central CLI, Air Alpha, and the Agentic Development Stack
Avatar for Daisuke Masuda x5gtrn
PRO
0
120
grill-me（grilling）：AI駆動開発を超助けてくれるSkill / grill me
Avatar for 数理の弾丸 mathbullet
0
100
Bet AI Day 2026丨バクラク Autopilot、業務システムの再設計
Avatar for LayerX layerx
PRO
2
1.2k
Nav2、Nav3 ... はたまた自作？〜 作って理解する Nav3 の設計意図 〜 / Nav2, Nav3 ... or Build Your Own? — Understanding Nav3's design intent by building it from scratch
Avatar for Yuki Anzai yanzm
0
220
20260903 Tokyo Jazug Night #62 | Azure エンジニアよ、 その環境は本当にセキュアか？
Avatar for Olivia olivia_0707
1
610
AIで実装は速くなった。なのにプロダクトは速くならない。職能の壁を越えて価値のフローを設計する
Avatar for nwiizo nwiizo
6
7k
Benchmarking Vector Databases: pgvector vs. LanceDB
Avatar for tsho tsho
0
140
いま、生成AIにKaggleをどこまで 任せられるか — ROGIIコンペでの進め方とTips
Avatar for monnu k951286
3
1.4k

Featured

See All Featured
Bioeconomy Workshop: Dr. Julius Ecuru, Opportunities for a Bioeconomy in West Africa
Avatar for AKADEMIYA2063 akademiya2063
PRO
1
340
The #1 spot is gone: here's how to win anyway
Avatar for Tamara Novitovic tamaranovitovic
3
1.2k
Highjacked: Video Game Concept Design
Avatar for Ryan Kendrick rkendrick25
PRO
1
450
Optimizing for Happiness
Avatar for Tom Preston-Werner mojombo
378
71k
A Tale of Four Properties
Avatar for Chris Coyier chriscoyier
163
24k
Designing Powerful Visuals for Engaging Learning
Avatar for Mike Taylor tmiket
1
530
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
Avatar for Mine Cetinkaya-Rundel minecr
1
370
Site-Speed That Sticks
Avatar for Harry Roberts csswizardry
13
1.5k
ラッコキーワード サービス紹介資料
Avatar for ラッコ株式会社 rakko
1
4.7M
Balancing Empowerment & Direction
Avatar for Lara Hogan lara
6
1.3k
sira's awesome portfolio website redesign presentation
Avatar for ElsiraPls elsirapls
0
400
How to optimise 3,500 product descriptions for ecommerce in one day using ChatGPT
Avatar for Katarina Dahlin katarinadahlin
PRO
2
3.8k

Transcript

  1. Thursday, October 10, 13

  2. Hector @hecbuma Thursday, October 10, 13

  3. Add time Thursday, October 10, 13

  4. Thursday, October 10, 13

  5. Thursday, October 10, 13

  6. Thursday, October 10, 13

  7. 15 beach houses Thursday, October 10, 13

  8. Thursday, October 10, 13

  9. Thursday, October 10, 13

  10. Thursday, October 10, 13

  11. Thursday, October 10, 13

  12. Thursday, October 10, 13

  13. Thursday, October 10, 13

  14. Thursday, October 10, 13

  15. CFP opens in november Thursday, October 10, 13

  16. Thursday, October 10, 13

  17. magmaconf.com Thursday, October 10, 13

  18. Photos by Thursday, October 10, 13

  19. Thursday, October 10, 13

  20. Cutting off the browser fat from your app Thursday, October

    10, 13

  21. browser fat? Thursday, October 10, 13

  22. http://static.rcgroups.net/forums/attachments/2/3/6/3/1/2/a3083784-42-Fat%2520Guy.jpg?d=1267091993 Thursday, October 10, 13

  23. Thursday, October 10, 13

  24. Thursday, October 10, 13

  25. http://www.celebitchy.com/wp-content/uploads/2010/07/fp_5311598_spears_britney_fp1_070110.jpg Thursday, October 10, 13

  26. Thursday, October 10, 13

  27. “I’m not a front-end guy, why should I care?” Thursday,

    October 10, 13

  28. Time = Money Thursday, October 10, 13

  29. 1 Mississippi Thursday, October 10, 13

  30. http://bitchinfilmreviews.com/wp-content/uploads/2012/06/Happy-Feet.jpg Thursday, October 10, 13

  31. 2 Mississippi Thursday, October 10, 13

  32. http://1.bp.blogspot.com/-RM9X-maQqks/ToCkP_ziwHI/ AAAAAAAABDE/ZtMyr67Ar-4/s1600/challenge+accepted+meme +blank.png Thursday, October 10, 13

  33. 3 Mississippi Thursday, October 10, 13

  34. http://marco-pivetta.com/doctrine-orm-zf2-tutorial/assets/img/waiting-meme.png Thursday, October 10, 13

  35. 4 Mississippi Thursday, October 10, 13

  36. http://www.thereplicapropforum.com/gallery/data/509/300-publicity-photo-26.jpg Thursday, October 10, 13

  37. The most important thing Thursday, October 10, 13

  38. Thursday, October 10, 13

  39. CSS Thursday, October 10, 13

  40. Right - to - Left Thursday, October 10, 13

  41. #active li a {...} Thursday, October 10, 13

  42. a li #active Thursday, October 10, 13

  43. Thursday, October 10, 13

  44. Thursday, October 10, 13

  45. Thursday, October 10, 13

  46. Thursday, October 10, 13

  47. Qualified Selectors ul#active {...} Thursday, October 10, 13

  48. Qualified Selectors #active {...} Thursday, October 10, 13

  49. Descendant Selectors body header div{ color: blue; } body header

    p{ color: red; } Thursday, October 10, 13

  50. Descendant Selectors .blue-text {color: blue;} .red-text {color: red;} Thursday, October

    10, 13

  51. Unqualified Selectors a[data-go^=”page-”]{ display: block; } Thursday, October 10, 13

  52. Chaining .big.blue.text {...} Thursday, October 10, 13

  53. Chaining .big-blue-text {...} Thursday, October 10, 13

  54. Remember Cascade #wrapper ul li a { font-family: 'Helvetica' }

    Thursday, October 10, 13

  55. Remember Cascade #wrapper { font-family: 'Helvetica' } Thursday, October 10,

    13

  56. Sass Thursday, October 10, 13

  57. Thursday, October 10, 13

  58. Nesting too deep Thursday, October 10, 13

  59. Thursday, October 10, 13

  60. Mixins Thursday, October 10, 13

  61. Thursday, October 10, 13

  62. @extend Thursday, October 10, 13

  63. Thursday, October 10, 13

  64. LEARN CSS Thursday, October 10, 13

  65. Thursday, October 10, 13

  66. css-tricks.com/ all-about-floats/ Thursday, October 10, 13

  67. smacss.com Thursday, October 10, 13

  68. OOCSS github.com/ stubbornella/oocss/wik Thursday, October 10, 13

  69. JS Thursday, October 10, 13

  70. MOVE IT DOWN! Thursday, October 10, 13

  71. Thursday, October 10, 13

  72. Thursday, October 10, 13

  73. Thursday, October 10, 13

  74. ASYNC & DEFER javascript_tag "alert('All is good')", :defer => 'defer'

    javascript_include_tag "application", :async => true Thursday, October 10, 13

  75. ID over Classes http://jsperf.com/web-test Thursday, October 10, 13

  76. Use Context on jQuery http://jsperf.com/jquery-context Thursday, October 10, 13

  77. Cached Objects http://jsperf.com/cache-objects Thursday, October 10, 13

  78. Avoid $.each http://jsperf.com/string-join2 Thursday, October 10, 13

  79. IMG Thursday, October 10, 13

  80. It’s all about fewer HTTP requests Thursday, October 10, 13

  81. 6 to 8 parallel connections Thursday, October 10, 13

  82. Thursday, October 10, 13

  83. Thursday, October 10, 13

  84. Thursday, October 10, 13

  85. File Types Thursday, October 10, 13

  86. JPEG Thursday, October 10, 13

  87. Thursday, October 10, 13

  88. PNG Thursday, October 10, 13

  89. Thursday, October 10, 13

  90. GIF Thursday, October 10, 13

  91. Thursday, October 10, 13

  92. Thursday, October 10, 13

  93. Thursday, October 10, 13

  94. DO NOT RESIZE! Thursday, October 10, 13

  95. Thursday, October 10, 13

  96. Set height and width! Thursday, October 10, 13

  97. Thursday, October 10, 13

  98. http://www.celebitchy.com/wp-content/uploads/2010/07/fp_5311598_spears_britney_fp1_070110.jpg Thursday, October 10, 13

  99. Serve GZIP Thursday, October 10, 13

  100. Thursday, October 10, 13

  101. Thursday, October 10, 13

  102. gem ‘heroku_rails_deflate’ Thursday, October 10, 13

  103. Rack::Deflater Thursday, October 10, 13

  104. Thursday, October 10, 13

  105. HTML Thursday, October 10, 13

  106. Thursday, October 10, 13

  107. TOOLS Thursday, October 10, 13

  108. kraken.io Thursday, October 10, 13

  109. Thursday, October 10, 13

  110. # NOTE: You will need `multipart-post` gem: # $ gem

    install multipart-post   require 'rubygems' require 'json' require 'net/https' require 'net/http/post/multipart'   url = URI.parse("https://api.kraken.io/file") uploadfile = {:name  =>'/Path/To/File.jpg'} auth = { "user"  => "your-kraken-username", "pass"  => "your-kraken-password", "apikey"  => "your-kraken-api-key" }.to_json   File.open(uploadfile[:name]) do  |file| req = Net::HTTP::Post::Multipart.new  url.path, "auth"  => auth, "file"  => UploadIO.new(file, 'logotyp.png')   https = Net::HTTP.new(url.host, url.port) https.use_ssl = true   res = https.start() {|conn| conn.request(req)} response = JSON.parse(res.body)   if  response['success'] puts 'Success. Optimized image URL: '  + response['krakedURL'] else puts 'Fail. Error message: '  + response['error'] end end Thursday, October 10, 13

  111. Chrome Developer tools Thursday, October 10, 13

  112. Thursday, October 10, 13

  113. Thursday, October 10, 13

  114. Retrospectus.com Thursday, October 10, 13

  115. ~30sec Thursday, October 10, 13

  116. ~6sec Thursday, October 10, 13

  117. Thursday, October 10, 13

  118. ` @hecbuma Thanks! Thursday, October 10, 13