Slide 1

Slide 1 text

Ugoku backend Ugoira Tech Talks / 2014-08-01 harukasan

Slide 2

Slide 2 text

• Infrastructure Team in pixiv since 2012 • nginx / Apache Traffic Server • Fluentd / Kibana / BigQuery • Kosenconf Harukasan / Shunsuke MICHII ! ൃച @harukasan shunsuke.michii

Slide 3

Slide 3 text

Ugoku Backend ͏͝ΠϥͷཪଆͰ

Slide 4

Slide 4 text

Works in Ugoira Project • ͏͍͝Βͷ͚ͩͷͨΊʹؾΛݣͬͨ෦෼͸
 ͦΕ΄Ͳͳ͍ • ಛච͢΂͖ࣄฑ͸͋·Γͳ͍…… • ͲͪΒ͔ͱ͍͏ͱৗʹ͕Μ͹͍ͬͯΔ͔Μ͡

Slide 5

Slide 5 text

Ugoku Backend

Slide 6

Slide 6 text

No content

Slide 7

Slide 7 text

Statistics 3,700,000,000 PV/month 11,000,000 Users 45,000,000 Illustrations |

Slide 8

Slide 8 text

Statistics 7K peak req/s (dynamic) 30K peak req/s (image) 12Gbps peak Traffic (image) 3 x 10Gbps backbone 40TB image files 400 servers

Slide 9

Slide 9 text

Ugoku Backend ͏͝ΠϥͷཪଆͰ

Slide 10

Slide 10 text

Ugoira Data Flow PHP nginx nginx Apache HTTPd nginx pixiv Contents Delivery Clusters uploading small light load balancing Store Images generating thumbnails Ý Creator Viewers PHP Redis queing

Slide 11

Slide 11 text

Ugoira Data Flow PHP nginx nginx Apache HTTPd nginx pixiv Contents Delivery Clusters uploading small light load balancing Store Images generating thumbnails Ý Creator Viewers PHP Redis queing

Slide 12

Slide 12 text

Upload System

Slide 13

Slide 13 text

Upload System • ࠷େ150ຕͷը૾ͷม׵ॲཧΛߦ͏ඞཁ͕͋Δ • ϢʔβʔΛग़དྷΔ͚ͩ଴ͨͤͳ͍Α͏ʹ͍ͨ͠

Slide 14

Slide 14 text

Asynchronous Uploading Upload View Information form View Complete View 1. ը૾ϑΝΠϧΛ
 Ξοϓϩʔυ 2. ৘ใೖྗ ○ ׬ྃΛ଴ͭ Redis Uplaod Worker upload αϜωΠϧϚελը૾ੜ੒ Ý upload Ý GIFը૾෼ׂ active standby 3. Ξοϓϩʔυ׬ྃ

Slide 15

Slide 15 text

Upload System • Ϣʔβʔ͕৘ใΛೖྗ͍ͯ͠Δؒʹ
 ը૾ϑΝΠϧΛ४උ • GIFը૾Λ෼ׂ Github: pixiv/gifsplit • ͏͝ΠϥͰ͸3छྨͷը૾Λ༻ҙ • WebDAVͰΞοϓϩʔυ͢Δ PHP nginx Redis php-resque nginx ϩʔυόϥϯα ΞϓϦέʔγϣϯ Ωϡʔ ϫʔΧʔ DAVετϨʔδ

Slide 16

Slide 16 text

Ugoira Data Flow PHP nginx nginx Apache HTTPd nginx pixiv Contents Delivery Clusters uploading small light load balancing Store Images generating thumbnails Ý Creator Viewers PHP Redis queing

Slide 17

Slide 17 text

Dynamic
 Thumbnail Generation

Slide 18

Slide 18 text

Dynamic Thumb. Generation • Ξοϓϩʔυ࣌ʹͨ͘͞ΜͷαϜωΠϧΛ
 ͭ͘Δͷ͸େม • αΠζ͸σβΠϯมߋͱ͔Ͱม͍͑ͨ • ༧ΊϚελը૾Λੜ੒ͯͦ͠Ε͔Βੜ੒͢Δ ΦϦδφϧը૾ αϜωΠϧϚελը૾ αϜωΠϧը૾

Slide 19

Slide 19 text

Thumbnail Master • ΞεϖΫτݻఆͱਖ਼ํܗΫϩοϓͷ2छྨ • JPEGը૾ʹม׵(PNG→JPEGͷม׵͸ॏ͍) 1200px 1200px 1200px 1200px 1200px 1200px ඪ४αΠζ(1200x1200ʹऩ·ΔαΠζ) ਖ਼ํܗΫϩοϓ(ԣ௕ͱॎ௕ͰΫϩοϓํ๏͕ҟͳΔ) ԣ௕͸தԝ߹Θͤ ॎ௕͸্߹Θͤ

Slide 20

Slide 20 text

• αϜωΠϧੜ੒͸mod_small_lightΛ࢖༻
 https://github.com/yamac/smalllight ! • ετϨʔδ͔ΒԿ౓΋Ϛελը૾Λ
 औಘ͠ͳ͍Α͏ʹΩϟογϡΛ͸͞Ή Dynamic Thumb. Generation Small Light ετϨʔδ Ωϟογϡ Ωϡʔ nginx Ý nginx ৼΓ෼͚

Slide 21

Slide 21 text

Ugoira Data Flow PHP nginx nginx Apache HTTPd nginx pixiv Contents Delivery Cluster uploading small light load balancing Store Images generating thumbnails Ý Creator Viewers PHP Redis queing

Slide 22

Slide 22 text

Contents Delivery Cluster

Slide 23

Slide 23 text

• εέʔϥϒϧ • ௿஗Ԇ (< 100ms) • ߴ͍ώοτ཰ (> 95%) • ઃఆ͕มߋ͠΍͍͢ Storage pixiv Contents Delivery Clusters Contents Delivery Cluster

Slide 24

Slide 24 text

Inside of pixiv CDC 10Gbps 10Gbps nginx nginx nginx ATS ATS ATS nginx nginx nginx Hashing 64GB Memory Caching (60%) 3x 256GB SSD Caching (90%) 1Gbps

Slide 25

Slide 25 text

Ugoira Compatibility • ZIPϑΝΠϧͷ഑৴ • CORS Non-simpleϦΫΤετ΁ͷԠ౴

Slide 26

Slide 26 text

CORS • ผυϝΠϯ΁ͷϦιʔε΁ͷϦΫΤετΛڐՄ͢Δ • simple requests / non-simple requests ͷ2͕ͭ͋Δ • Ϟμϯϒϥ΢β͸͍͍ͩͨରԠ

Slide 27

Slide 27 text

CORS Non-Simple Request someone.example.com www.pixiv.net/api var req = new XMLHTTPRequest(); req.open(“GET”, “//www.pixiv.net/api”); req.setRequestHeader(“Range”, “0-10000”); req.send(); GET /api HTTP/1.1 Origin:someone.example.com Range: 0-10000 ϒϥ΢βͰϒϩοΫ͞ΕΔ

Slide 28

Slide 28 text

someone.example.com www.pixiv.net/api OPTIONS /api HTTP/1.1 Origin:someone.example.com Access-Control-Request-Headers: range Access-Control-Request-Method: GET Preflight request HTTP/1.1 200 OK Access-Control-Allow-Headers: Range Access-Control-Allow-Methods: GET, POST, OPTIONS Access-Control-Allow-Origin:* Access-Control-Expose-Headers: Content-Length Access-Control-Max-Age: 2592000 ڐՄ͢ΔϦΫΤετϔομ ڐՄ͢ΔϦΫΤετϝιου ڐՄ͢ΔϦΫΤετݩΦϦδϯ Script͔Βར༻Ͱ͖ΔϨεϙϯεϔομ ΩϟογϡՄೳ࣌ؒ ڐՄΛٻΊΔϦΫΤετϔομ ڐՄΛٻΊΔϦΫΤετϝιου GET /api HTTP/1.1 Origin:someone.example.com Range: 0-10000

Slide 29

Slide 29 text

Ugoira Data Flow PHP nginx nginx Apache HTTPd nginx pixiv Contents Delivery Cluster uploading small light load balancing Store Images generating thumbnails Ý Creator Viewers PHP Redis queing

Slide 30

Slide 30 text

Complete!

Slide 31

Slide 31 text

Conclusion • ͏͝ΠϥͷόοΫΤϯυ͸ී௨ʹ͏͍͍ͯ͝Δ • ៉ྷͳγεςϜ΋ྑ͍͚Ͳ͏͘͝ͷ͸લఏ • ͏্͘͝ʹ֦ு͠΍͍͢ͷ͸ॏཁ