forkwell.com Y U SO SLOW

Transcript

1. Monday, September 3, 12

2. whoami ★Twitter: a_matsuda ★GitHub: amatsuda Monday, September 3, 12

3. Monday, September 3, 12

4. begin Monday, September 3, 12

5. Forkwellͬͯ ͳΜ͔஗͍Ͱ͢ΑͶʁ Monday, September 3, 12

6. WHO SLOW? ★server side ★network ★client side Monday, September 3,

   12

7. WHO SLOW? - server side ★infra ★code Monday, September 3,

   12

8. infra ★AP server ★DB Monday, September 3, 12

9. AP Server ★Passenger vs Unicorn Monday, September 3, 12

10. Passenger > Unicorn ? “ͳͥ Forkwell ͸ϦϦʔεॳ೔ʹ αʔόμ΢ϯΛ܁Γฦͨ͠ͷ͔“ http://annex-forkwell.heroku.com/2012/04/12/ server_failure

    Monday, September 3, 12

11. ͢·Μͳɻ͋Ε͸ӕͩ Unicorn଎͍Θʔ (ͨͩ͠ɺRails͕ ݩؾʹಈ͍͍ͯΔݶΓ͸) Monday, September 3, 12

12. DB ★ CPU࢖༻཰͕(ͨ·ʹ)όΫϋπ ★ ͦΜͳෳࡶͳܭࢉͯ͠ΔΑ͏ͳΞϓϦ͡Ό ͳ͍ͷͰDBαʔόʔͷCPU࢖͏ͳΜͯ໌Β ͔ʹ͓͔͍͠ Monday, September 3,

    12

13. DB ★full scan... ★indexுΓ๨ΕͯΔΑ... Monday, September 3, 12

14. % rails g ★ e.g. when Post has_many Comments ★

    % rails g model comment post:references body:text - indexed ★ % rails g migration add_user_id_to_comment user_id:integer - not indexed Monday, September 3, 12

15. PROTIP: ϚΠάϨʔγϣϯͰΧϥϜ௥Ճ ͢Δͱ͖͸index΋๨Εͣʹʂ Monday, September 3, 12

16. code ★Ruby ★Rails Monday, September 3, 12

17. Ruby ★Ruby 1.9.3 Monday, September 3, 12

18. Ruby 1.9.3 ଎͍ΑͶʁ Monday, September 3, 12

19. Rails ★Rails 3.2.8 Monday, September 3, 12

20. ී௨ʹ࠷৽ͷRailsΛ࢖͍ͬͯͨͩ ͚Ͱୡ੒Ͱ͖͍ͯͨ͜ͱ ★Asset Pipeline Monday, September 3, 12

21. Asset Pipeline ★assets͸WEBαʔόʔͰ ★.scss => .css, .coffee => .js ΛϓϦ

    ίϯύΠϧ ★*.js, *.cssΛ1ϑΝΠϧʹ݁߹ Monday, September 3, 12

22. ʮRails͔ͩΒ଎͍ʯ ࣌୅ Monday, September 3, 12

23. slow code ★slow query ★N+1 queries ★“Activity” Monday, September 3,

    12

24. slow query ★ ࠷ۙ୭͔ͷΞΫςΟϏςΟ͕͋ͬͨεΩϧλάͷ TOP 20-ish(20݅͝ͱʹϖʔδωʔγϣϯ) ★ ↑ͷͦΕͧΕͷεΩϧλά͝ͱʹ(ࣗ෼ͷ༑ͩͪͷ)୭ ͔͕௚ۙ7೔ؒҎ಺ʹߦͬͨΞΫςΟϏςΟͷ࠷৽6 ݅(ͨͩ͠ʮ+1͠·ͨ͠ʯͱʮಡΜͩΑʯ͸࠷৽ͷ΋

    ͷͷΈ)ʹ͍ͭͯɺ୭͕(FBʹొ࿥͞ΕͯΔݱࡏͷϩ έʔϧͷϑϧωʔϜ + ΞΠίϯը૾)ԿΛͲ͏͔ͨ͠ (I18nͭͭ͠)දࣔɻ7݅Ҏ্͋Δ৔߹͸ʮ΋ͬͱݟ ΔʯϘλϯΛදࣔɻ Monday, September 3, 12

25. τοϓϖʔδͰൃߦ͞ΕΔSQL ★before: SQL਺ඦൃ ★after: 2 SQLs Monday, September 3, 12

26. SQL quiz ύϒϦέʔγϣϯ͝ͱʹgroup by ͨ͠άϧʔϓ͝ͱʹ order by + limitͰ࠷৽ͷΞΫςΟϏςΟΛ6 ݅ͣͭऔಘɺ͍ͭͰʹʮ΋ͬͱݟ

    Δʯ͔Ͳ͏͔΋஌Γ͍ͨ Monday, September 3, 12

27. use vendor speci c SQL # -*- coding: utf-8 -*-

    class Activity < ActiveRecord::Base ... # ड͚औͬͨactivitiesΛɺpublication_idͷ஋͝ͱʹ࠷େ7݅ͣͭʹߜͬͯฦ͢ # [MySQLݶఆ] def self.select_top_7_per_publication_id(activities) # ࠷৽ͷ6+1݅(see moreΛදࣔ͢Δ͔Ͳ͏͔Λ൑ఆ͢ΔͨΊʹ׶͑ͯ1݅ଟΊʹऔಘ) Activity.from(<<-SQL).where("activities.row_number <= #{DISPLAY_ACTIVITY_NUM + 1}") (select *, if(@previous_publication_id <> publication_id, @rownum := 1, @rownum := @rownum + 1) as row_number, @previous_publication_id := publication_id from (#{activities.to_sql}) as a cross join (select @rownum := NULL, @previous_publication_id := 0) as r order by publication_id, id desc ) AS activities SQL end ... end ΩϞ͍ Monday, September 3, 12

28. ੜSQL্౳ ★ ARͷύϑΥνϡʔ͸ੜSQLॻ͍ͯ ͳΜ΅ ★ Ή͠ΖARͷ୉ޣຯ͸ੜSQLͱͷڞଘ (ͬͯMartin Fowler΋ݴͬͯͨ) ★ ՄಡੑɾอकੑͱύϑΥʔϚϯεͷ

    τϨʔυΦϑ Monday, September 3, 12

29. ṖSQLϩδοΫ ★scopeʹด͡ࠐΊͯ ★ద੾ͳ໊લΛ෇͚ͯ ★୯ମςετͰ୲อ Monday, September 3, 12

30. use AR::Relation ★AR::Relation#merge ★AR::Relation#to_sql Monday, September 3, 12

31. PROTIP: ੜSQLສࡀ Monday, September 3, 12

32. PROTIP: use PostgreSQL Monday, September 3, 12

33. N+1 queries ★Bullet https://github.com/ yerhzm/ bullet ★৭ʑڭ͑ͯ͘ΕΔͷͰɺ(ಛʹ SQL͕͋·Γಘҙ͡Όͳ͍ਓʹ ͸)ศར͔΋Ͷ Monday,

    September 3, 12

34. PROTIP: use Bullet (if you need) Monday, September 3, 12

35. “Activity” Monday, September 3, 12

36. WUT SLOW? ★ܭଌ͠Α͏ʂ Monday, September 3, 12

37. rack-mini-pro ler ★rack-mini-pro ler https:// github.com/SamSaffron/ MiniPro ler/tree/master/Ruby ★(demo) Monday,

    September 3, 12

38. “Activity” ★ ࣮ߦऀͷFBΞΠίϯը૾ ★ ͳΜ͔ෳࡶͰॏ͍ͨۀ຿ϩδοΫΛܦͯ ग़͖ͯͨจݴΛI18nͨ͠΋ͷ ★ Ұ౓࡞ΒΕͨΒมΘΒͳ͍ ★ ঢ়ଶ΍ϩάΠϯϢʔβʔʹΑΔมԽΛड

    ͚ͳ͍(I18n.localeҎ֎͸) Monday, September 3, 12

39. fragment cacheͷ ग़൪Ͱ͢Ͷɻ Monday, September 3, 12

40. Rails3ϨγϐϒοΫ 293ϖʔδ Monday, September 3, 12

41. fragment cache ͜ΕͰϖʔδશମ͕1.5ഒ଎ ͙Β͍ʹͳͬͨ Monday, September 3, 12

42. PROTIP: use fragment cache Monday, September 3, 12

43. PROTIP: ͓खݩʹҰ࡭ɺ ”Rails3ϨγϐϒοΫ” Monday, September 3, 12

44. WHO SLOW? - network Amazon EC2 + S3 Monday, September

    3, 12

45. Facebook API (fb_graph) FB APIΛසൟʹୟ͘ΞϓϦͩͱ αʔόʔ͕USʹ͋Δ΄͏͕଎͍ (͜ͱ΋͋Δ) Monday, September 3,

    12

46. ͱࢥͬͯαʔόʔΛUS ੢ւ؛ʹஔ͍ͯͨ Monday, September 3, 12

47. ͚Ͳ΍ͬͺΓ Ͳ͏ߟ͑ͯ΋஗͍ Monday, September 3, 12

48. ͷͰࡢ೔Tokyo regionʹ Ҿͬӽ͠·ͨ͠ ★(demo) http://forkwell.com/ humans.txt Monday, September 3, 12

49. PROTIP: use AWS Tokyo region Monday, September 3, 12

50. WHO SLOW? - network ★ܭଌͯ͠ΈΔ Monday, September 3, 12

51. tools ★ PageSpeed (Google) ★ YSlow (Yahoo) ★ Chrome Developer

    Tools -> Audits ★ PageSpeed Insights https:// developers.google.com/speed/pagespeed/ insights ★ WEBPAGETEST http://www.webpagetest.org/ Monday, September 3, 12

52. PageSpeed ★(demo) Monday, September 3, 12

53. ݪҼͱରࡦ ★ৄ͘͠͸͜ͷ΁Μݟ͍ͯͩ͘͞ Web Performance Best Practices https://developers.google.com/ speed/docs/best-practices/ rules_intro Monday,

    September 3, 12

54. ରࡦ ★Optimize images ★ը૾ͷlazyload ★Defer parsing of JavaScript ★document.ready →

    $ -> ★CSS sprites Monday, September 3, 12

55. Optimize images ★ImageOptim http:// imageoptim.com/ Monday, September 3, 12

56. ը૾ͷlazyload FBΞΠίϯը૾ͨͪͷϩʔυ͕஗ ͗͢ΔͷͰɺ࠷ॳ͸ผͷը૾Λग़ ͓͍ͯͯ͠ޙ͔ΒJSͰࠩ͠ସ͑Δ ͱ͍͏࡞ઓ Monday, September 3, 12

57. jquery.lazyload.js jquery.lazyload.js http:// www.appelsiini.net/projects/lazyload Monday, September 3, 12

58. Defer parsing of JavaScript “Putting inline scripts after all other

    resources prevents blocking of other downloads, and it also enables progressive rendering.” https://developers.google.com/speed/ docs/best-practices/ rtt#PutStylesBeforeScripts Monday, September 3, 12

59. document.ready → $ -> ΠϕϯτൃՐλΠϛϯάͷ ࠷దԽ Monday, September 3, 12

60. CSS sprites ͜ΜͳͷσβΠφʔ͞Μ͕ͪ·ͪ ·΍Δ࡞ۀͰ͠ΐʁͬͯࠓ·Ͱ͸ ๻΋ࢥͬͯͨΜͰ͕͢ɺ Monday, September 3, 12

61. Compass Spriting with Compass http:// compass-style.org/help/tutorials/ spriting/ Monday, September 3,

    12

62. CompassϠό͍؆୯͗ͯ͢Ϡό͍ ★ ର৅ը૾ϑΝΠϧΛద౰ͳσΟϨΫτϦʹ Ҡಈ % mkdir app/assets/images/icons % mv app/assets/images/{foo.png,bar.png,icons}

    ★ SCSS import "icons/*.png"; @include all-icons-sprites; ★ HTML = link_to ‘’, somewhere_path, class: 'icons-foo' Monday, September 3, 12

63. “Use a Content Delivery Network (CDN)” Monday, September 3, 12

64. Amazon CloudFront CDN S3ʹஔ͍ͯΔϑΝΠϧͳͲΛੈք தʹedgeαʔόʔͰΩϟογϡ͠ ͓ͯಧ͚ Monday, September 3, 12

65. CloudFront ★(demo) ★(Ͳͬͪʹ͠ΖTokyoͳΜͰɺେ ͖ͳࠩ͸ग़·ͤΜ) Monday, September 3, 12

66. “Make fewer HTTP requests” ϦμΠϨΫτଟ͗͢ Monday, September 3, 12

67. ϦμΠϨΫτଟ͗͢ ★https://graph.facebook.com/4/ picture ★ => (302) CDNͷURL ★࣮ࡍͷը૾ΛϦΫΤετ Monday, September

    3, 12

68. https://graph.facebook.com/4/picture ★(demo) Monday, September 3, 12

69. “Facebook”ͷͤ͘ʹإ ͷը૾औͬͯ͘Δͷ͕ ஗͍ͱ͸ͳʹ͝ͱͩ Monday, September 3, 12

70. ͦ͜Ͱɺը૾ϑΝΠϧΛࣗલͰ Ωϟογϡ ★ αʔόʔଆͰ͋Β͔͡Ίը૾Λμ΢ϯϩʔυ ★ S3ʹసૹ ★ CloudFront্ͷը૾URLΛϢʔβʔͷ identi erͱඥ෇͚ͯmemcachedʹΩϟογϡ

    ★ Ҏ্ͷॲཧΛCarrierWaveͷuploaderΛྲྀ༻͠ ࣮ͯ૷͸ίϯύΫτʹ Monday, September 3, 12

71. ͜Μͳۤ࿑ͯ͠·ͰFB ࢖͏ඞཁ͋Μͷʁ Monday, September 3, 12

72. PROTIP: use Gravatar e.g. http://qa.atmarkit.co.jp/ users/a_matsuda Monday, September 3, 12

73. Cache-Control S3, CF্ͷը૾ϑΝΠϧͷΩϟο γϡؔ࿈ϔομ Monday, September 3, 12

74. CarrierWaveͳΒ؆୯ fog_attributesʹઃఆ͢Δ͚ͩ Monday, September 3, 12

75. ͦΜͳ͜ΜͳͰݱࡏͷ http://forkwell.com/ 2ඵલޙɺ͙Β͍ʁ Monday, September 3, 12

76. ࠓޙͷల๬ Monday, September 3, 12

77. Y current forkwell.com still slow? ★Assets ★social buttons & tracking

    ★શ෦ೖΓJS & શ෦ೖΓCSSͷฐ֐ ★ͦ΋ͦ΋τοϓϖʔδ͕ ͪ͝Όͪ͝Ό͗͢͠ Monday, September 3, 12

78. Assets ★·ͩPageSpeedʹౖΒΕΔ ★precompileͨ͠assets΋શ෦S3 & CFʹࡌͤΒΕͳ͍΋ͷ͔ʁ => asset_sync http://github.com/ rumblelabs/asset_sync Monday,

    September 3, 12

79. social buttons & tracking ★ඇಉظͰಡΈࠐΜͰ΋ͦͷޙ͕ ஗͍ ★Ͳ͏ʹ͔ͳΒΜ΋ͷ͔ Monday, September 3,

    12

80. ࢼ͠ʹ͍ͭ͜Β͕ແ͔ͬͨΒʁ ★࣮͸LikeϘλϯͱTweetϘλϯͱ ΞΫηεղੳ͕ແ͔ͬͨΒ1ඵ୹ ॖ͞ΕΔ ★(demo) Monday, September 3, 12

81. શ෦ೖΓJS & શ෦ೖΓCSS ★Asset Pipelineͷ໋॓ ★τοϓϖʔδͰಡΈࠐΜͰΔCSS ͷ8ׂҎ্͸ؔ܎ͳ͍CSS ★΍ͬͺΓ࢖͏΋ͷ͚ͩʹ෼ׂ͠ ͨ΄͏͕଎ͦ͏ͳؾ͕ Monday,

    September 3, 12

82. ͦ΋ͦ΋τοϓϖʔδ͕ͪ͝Ό͝ ͪΌ͗͢͠ ★͜Ε͕࠷଎ http://qiita.com/ ★(ݸਓతʹ͸)͜Μͳײ͡ʹ͍ͨ͠ ★ʮϦσβΠϯʯ http:// forkwell.com/jobs/100 Monday, September

    3, 12

83. ʮϦσβΠϯʯ ৽σβΠφʔ͞Μʹظ଴ʂ Monday, September 3, 12

84. end Monday, September 3, 12