Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Ugoku Backend
Search
Harukasan
PRO
August 02, 2014
Technology
1
1.9k
Ugoku Backend
Ugoku "It's working" Backend
pixiv Ugoira Tech Talks / 2014-08-01
Harukasan
PRO
August 02, 2014
Tweet
Share
More Decks by Harukasan
See All by Harukasan
Successor to PicoRabbit: Ruby Programming Envorinment / RubyKaigi 2025 follow up
harukasan
PRO
1
210
Write your own mrbgem, Create your own device
harukasan
PRO
1
190
PicoRabbit: a Tiny Presentation Device Powered by Ruby
harukasan
PRO
2
590
pixivを支える技術 / 技育CAMPアカデミア
harukasan
PRO
3
540
20240401 新卒研修 - ピクシブにおける技術領域
harukasan
PRO
1
880
ピクシブのコンテンツ配信基盤技術 / pixiv TECH SALON
harukasan
PRO
5
5.8k
Goにおける画像ファイル処理 / golang.tokyo #19
harukasan
PRO
7
6.7k
WebRTC動画をトランスコードする / Transcoding video streams from WebRTC
harukasan
PRO
5
1.6k
ImageFluxを支えるリモート開発 / 20171202
harukasan
PRO
2
1.9k
Other Decks in Technology
See All in Technology
AIプラットフォームにおけるMLflowの利用について
lycorptech_jp
PRO
1
170
SQLだけでマイグレーションしたい!
makki_d
0
320
たまに起きる外部サービスの障害に備えたり備えなかったりする話
egmc
0
220
Reinforcement Fine-tuning 基礎〜実践まで
ch6noota
0
190
年間40件以上の登壇を続けて見えた「本当の発信力」/ 20251213 Masaki Okuda
shift_evolve
PRO
1
140
品質のための共通認識
kakehashi
PRO
3
270
今年のデータ・ML系アップデートと気になるアプデのご紹介
nayuts
1
480
Databricks向けJupyter Kernelでデータサイエンティストの開発環境をAI-Readyにする / Data+AI World Tour Tokyo After Party
genda
1
540
評価駆動開発で不確実性を制御する - MLflow 3が支えるエージェント開発
databricksjapan
1
210
チーリンについて
hirotomotaguchi
6
2k
モダンデータスタック (MDS) の話とデータ分析が起こすビジネス変革
sutotakeshi
0
510
SREには開発組織全体で向き合う
koh_naga
0
370
Featured
See All Featured
Speed Design
sergeychernyshev
33
1.4k
Designing for humans not robots
tammielis
254
26k
YesSQL, Process and Tooling at Scale
rocio
174
15k
The Art of Programming - Codeland 2020
erikaheidi
56
14k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
25
1.6k
Writing Fast Ruby
sferik
630
62k
Reflections from 52 weeks, 52 projects
jeffersonlam
355
21k
Docker and Python
trallard
47
3.7k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.5k
Build your cross-platform service in a week with App Engine
jlugia
234
18k
Side Projects
sachag
455
43k
Transcript
Ugoku backend Ugoira Tech Talks / 2014-08-01 harukasan
• Infrastructure Team in pixiv since 2012 • nginx /
Apache Traffic Server • Fluentd / Kibana / BigQuery • Kosenconf Harukasan / Shunsuke MICHII ! ൃച @harukasan shunsuke.michii
Ugoku Backend ͏͝ΠϥͷཪଆͰ
Works in Ugoira Project • ͏͍͝Βͷ͚ͩͷͨΊʹؾΛݣͬͨ෦ ͦΕ΄Ͳͳ͍ • ಛච͖͢ࣄฑ͋·Γͳ͍…… •
ͲͪΒ͔ͱ͍͏ͱৗʹ͕Μ͍ͬͯΔ͔Μ͡
Ugoku Backend
None
Statistics 3,700,000,000 PV/month 11,000,000 Users 45,000,000 Illustrations |
Statistics 7K peak req/s (dynamic) 30K peak req/s (image) 12Gbps
peak Traffic (image) 3 x 10Gbps backbone 40TB image files 400 servers
Ugoku Backend ͏͝ΠϥͷཪଆͰ
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
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
Upload System
Upload System • ࠷େ150ຕͷը૾ͷมॲཧΛߦ͏ඞཁ͕͋Δ • ϢʔβʔΛग़དྷΔ͚ͩͨͤͳ͍Α͏ʹ͍ͨ͠
Asynchronous Uploading Upload View Information form View Complete View 1.
ը૾ϑΝΠϧΛ Ξοϓϩʔυ 2. ใೖྗ ◦ ྃΛͭ Redis Uplaod Worker upload αϜωΠϧϚελը૾ੜ Ý upload Ý GIFը૾ׂ active standby 3. Ξοϓϩʔυྃ
Upload System • Ϣʔβʔ͕ใΛೖྗ͍ͯ͠Δؒʹ ը૾ϑΝΠϧΛ४උ • GIFը૾Λׂ Github: pixiv/gifsplit •
͏͝ΠϥͰ3छྨͷը૾Λ༻ҙ • WebDAVͰΞοϓϩʔυ͢Δ PHP nginx Redis php-resque nginx ϩʔυόϥϯα ΞϓϦέʔγϣϯ Ωϡʔ ϫʔΧʔ DAVετϨʔδ
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
Dynamic Thumbnail Generation
Dynamic Thumb. Generation • Ξοϓϩʔυ࣌ʹͨ͘͞ΜͷαϜωΠϧΛ ͭ͘Δͷେม • αΠζσβΠϯมߋͱ͔Ͱม͍͑ͨ • ༧ΊϚελը૾Λੜͯͦ͠Ε͔Βੜ͢Δ
ΦϦδφϧը૾ αϜωΠϧϚελը૾ αϜωΠϧը૾
Thumbnail Master • ΞεϖΫτݻఆͱਖ਼ํܗΫϩοϓͷ2छྨ • JPEGը૾ʹม(PNG→JPEGͷมॏ͍) 1200px 1200px 1200px 1200px
1200px 1200px ඪ४αΠζ(1200x1200ʹऩ·ΔαΠζ) ਖ਼ํܗΫϩοϓ(ԣͱॎͰΫϩοϓํ๏͕ҟͳΔ) ԣதԝ߹Θͤ ॎ্߹Θͤ
• αϜωΠϧੜmod_small_lightΛ༻ https://github.com/yamac/smalllight ! • ετϨʔδ͔ΒԿϚελը૾Λ औಘ͠ͳ͍Α͏ʹΩϟογϡΛ͞Ή Dynamic Thumb. Generation
Small Light ετϨʔδ Ωϟογϡ Ωϡʔ nginx Ý nginx ৼΓ͚
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
Contents Delivery Cluster
• εέʔϥϒϧ • Ԇ (< 100ms) • ߴ͍ώοτ (> 95%)
• ઃఆ͕มߋ͍͢͠ Storage pixiv Contents Delivery Clusters Contents Delivery Cluster
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
Ugoira Compatibility • ZIPϑΝΠϧͷ৴ • CORS Non-simpleϦΫΤετͷԠ
CORS • ผυϝΠϯͷϦιʔεͷϦΫΤετΛڐՄ͢Δ • simple requests / non-simple requests ͷ2͕ͭ͋Δ
• Ϟμϯϒϥβ͍͍ͩͨରԠ
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 ϒϥβͰϒϩοΫ͞ΕΔ
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
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
Complete!
Conclusion • ͏͝ΠϥͷόοΫΤϯυී௨ʹ͏͍͍ͯ͝Δ • ៉ྷͳγεςϜྑ͍͚Ͳ͏͘͝ͷલఏ • ͏্͘͝ʹ֦ு͍͢͠ͷॏཁ