サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
iPhone 16
inside.pixiv.net
こんにちは、@harukasanです。 普段はpixivのインフラチームでpixivのインフラや画像配信インフラを担当しています。 今回は社内でおもしろそうな話をしてたので聞いていたところ、1,000万ユーザー記念企画をやることになっていました。 さて、今日は「超大量絵馬」企画がどのように動いているかをさくっと解説したいと思います。 「超大量絵馬」の主な機能 今回の「超大量絵馬」は3人のエンジニアがフルコミットで開発しました。 プロトタイピングが始まったのは1月の中旬くらいでしたが、 前回の記事にあったとおり、絵馬の形が決まってから本体の開発期間は2週間少ししかありませんでした。 開発しないといけないことはたくさんありましたが、次の3つがメイン機能です。 隣の人が描いているのがわかるリアルタイムお絵かき サーバで生成したサムネイル画像をスクロールして閲覧できるビューア 誰が描き始めたかわか
こんにちは。pixivのデザイナー@yspです。 おかげ様でpixivのユーザー数が10,000,000を突破しました。 そのタイミングで、2月22日に超大量絵馬という物をリリースしました。 今日はサクッと「超大量絵馬」企画がどんな感じで始まり、何故この形に着地したのかを書いておきます。 そもそもpixivは、ユーザー数の切りがいい所で何かしらのイベントをやってます。 今回もその一環なんですが、10,000,000という大事な節目です。 @yksk先生とUIについて侃々諤々の議論をしている最中に、 弊社のディレクターのスーさんが遠慮しがちにこう言ってきたわけです。 スーさん「Yさん、10,000,000ユーザー企画お願いします」 僕「えっ、、、お、、おう、、(白目」 10,000,000ユーザー企画という大事な企画にご指名とあらばもうやるっきゃない☆ こんな運びでこの企画は始まりました。
あけましておめでとうございます。最近ジョインした新兵の @bash0C7です。広告系の技術サイドを担当しています。 新年一発目のエントリーとして、昨年末にbetaリリースされたTreasure Agent Monitoringを速攻でProduction環境で使い始めている件について共有します。 Treasure Agent Monitoringとは Treasure Data社が提供している、Fluentd/td-agentのモニタリングサービスです。 2013/12/13開催のFluentd Casual Talks #3で発表され、同日よりベータリリース中です。 詳細はベータリリースのアナウンススライドをご覧ください。 セットアップ方法 fluentd-plugin-for-td-monitoringのgithubのREADMEをご参照ください。 プラグインとして提供されているので、
初登場の @tototoshi です。今回は pixiv のユニットテストで利用しているモックライブラリの紹介をします。 ここ2ヶ月くらいの間、レガシー化したとあるモジュールのリファクタリングに取り組んでいました。 リファクタリングにはテストコードが必須です。しかし今ではすっかりテストを書く文化が根付いている pixiv にもテストコードがない時代がありました。リファクタリングが必要な古いコードにはテストコードがないことが多く、そういったコードに新たにテストをつけていくのはなかなか大変です。テストの概念のないプロジェクトはテスト可能なように設計・実装されていません。テストを書くのが大変なのではなく、書けるようにするまでが大変です。 特にやっかいだったのは DB を参照したりするようなスタティックメソッドを使ったメソッドのテストでした。以下のようなスタティックな Dao を使用した Serv
久々にパワプロで遊んでいるbokkoです。でもパワポケの方が好きです。 さて、前回の記事でも紹介したように pixivではアプリケーションサーバで稼働しているPHPのバージョンを最新の5.5にマイグレーションするプロジェクトが進行中です。 そしてこの度pixivのWebアプリケーションサーバのPHPのバージョンはpixiv以外のサービスや内部用、小規模なものを除いて全て5.5になりました。 PHP5.5化による効果 移行後に最も効果が顕著だったのがWebアプリケーションサーバのCPU使用率です。ピーク時のCPU使用率が大幅に減少しているのが分かります。 グラフが途切れているのはPHPのバージョンアップに合わせてOSのアップグレード(Debian squeeze -> Debian wheezy)も同時に行ったためです。 そのため一概にPHPのバージョンアップだけのおかげとは言えないのですが
先月末から一週間ほど旅に出ていたbokkoです。今回はpixivでのPHPのバージョンアップに関する取り組みの一部を紹介します。 pixivとPHP pixivではWebアプリケーションの開発で主にPHPを利用しており、今のところPHP5.3とPHP5.4で動いている環境が混在している状態ですが、これをPHP5.5化するプロジェクトが進行中です。 オペコードキャッシュとユーザキャッシュによるPHPアプリケーションの高速化 pixivのようなPVの多いWebサイト(2013年10月現在で38億/月)をPHPで運用する場合、 アプリケーションのパフォーマンスという観点ではもちろんのこと、運用にかかるコストの面でも APCやZendOpcacheが提供しているようなオペコードキャッシュ機能は必須と言えます。 サーバスペックが高いマシン(CPUコア数が16とか24)を使っているということもあります
去年と比べて体重を8kb・・・間違えました8kg落としたbokkoです。目標体重まであとさらに8kgとなりました。道は険しく遠いです。 先週末の9/14(土)に東京都大田区産業プラザ(PiO)にて開催されたPHPカンファレンス2013にスピーカーとして参加してきました。以下はその資料になります。 inside pixiv’s infrastructure〜application cluster side〜 やや駆け足でしたが、トークではpixivの開発体制、アプリケーション基盤でのPHPの使われ方、データストア・キャッシュ戦略、 pixiv内部で利用されているRESTful APIの仕組みについてお話させていただきました。 今回は「application cluster side」ということでアプリケーション基盤の話がメインでしたが、 機会があれば「contents delivery cl
ドーモ、はじめまして。 WEBアプリケーションエンジニアの@Moyashipanです。 毛糸を触ると手がかゆくなる体質なのに、趣味は編みぐるみです。 さて、前編の記事では@ykskがアクセス解析機能の UI について解説しましたが、 後編ではアクセス解析機能のリリースまでの流れについてご紹介します。 まず初めに、アクセス解析機能の開発はプロトタイピングを行うことから始められました。 プロトタイピングを行うねらいは以下の通りです。 どのような方法で実装するのかを検討する 集計結果から、ユーザにとって有益な情報が得られるのかを調査する 実際に行われた複数のプロトタイピングについて、時系列に沿って以下に紹介します。 プロトタイピング : ログファイルから 初期のプロトタイピングでは、既存のpixivのアプリケーションに処理を追加しなくて良いように、すでに存在しているログファイルを利用してグラフ
こんにちは。UI大好きフロントエンド担当の@ykskです。主な仕事はコメントを書くことです。。 さて、先日pixivにプレミアム会員限定のアクセス解析機能が付きました。 プレミアム会員の方はこちらからご自分のレポートを見ることがきます。会員でない方はこちらに登録ページが、また、こちらにサンプルページがあります。主な機能は現在のところ以下の通りです。 イラストの全作品とそれぞれの作品についての閲覧数、総合点/評価回数、コメント数、ブックマーク数と被フォローユーザー数を直近1週間のグラフで見ることができる 作品のリファラー(pixiv内外のどこから訪問されたか)を見ることができる 最近反応のあった作品のリストを見ることができる 今回僕はUIの設計とJS、HTML、CSSの実装を担当したのですが、その際メイン機能のグラフを描く部分ではD3というデータのビジュアライズに特化したライブラリを使ってみ
ご挨拶エントリに引き続きインフラ兼ソフトウェアエンジニアのbokkoです。 記念すべき第一回目のエントリは拙作のソフトウェアであるngx_small_lightについて紹介させていただきます。(スライドはこちら) ngx_small_lightは簡単に言うとNginxで画像変換を行うための拡張モジュールで、 mod_small_lightというApacheモジュールをNginx用に移植したものです。 元々pixivではサービスで使われている一部のサムネイルをpixiv用に改造したmod_small_lightで動的に生成しているのですが、 それと同時にApacheよりも柔軟な設定を記述しやすいNginxをアプリケーションサーバ群や画像キャッシュサーバ群のフロントサーバとして ヘビーに活用しており(このあたりの話も近いうちに紹介したいものです)、以前からNginxで画像変換を行いたいという要
Zoff PCのカラータイプ眼鏡を愛用しているインフラ兼ソフトウェアエンジニアのbokkoです。 夏休みは山登り -> 温泉で悠々自適に過ごしてましたが、休み明けから筋肉痛で体のあちこちが痛いです(><)。 今回はpixivで活用しているデータストアやその周辺ミドルウェアの話を3回くらいに分けてしようと思います。 pixivを支えるデータストア pixivでは主に以下の2つをデータストアとして活用しています。 MySQL KyotoTycoon MySQL pixivではユーザやイラスト、ブックマーク、あるいはそれらに関連した情報といったサービスの根幹に関わるデータはMySQLに保存しています。 これはMySQLの高い信頼性のほかに、ピクシブ社内でMySQLの運用に関するノウハウが蓄積されていたり、自作の運用ツール群が充実しているというのが大きな理由です。 KyotoTycoon Kyot
先月末にwww.pixiv.netのバージョン管理をSubversionからGitに移行できてホッとしているインフラ兼ソフトウェアエンジニアのbokkoです。 pixivのSubversionリポジトリには\( ^ o ^ )/ディレクトリなるものが存在していて、開発が終了したプロジェクトやもう使われなくなったソースコードはremoveされるのではなく、 この\( ^ o ^ )/ディレクトリにmoveされます。 www.pixiv.netもGitに移行した後、{trunk,branches,tags}のすべてを\( ^ o ^ )/へmoveしましたが、あまりにも巨大過ぎて「svn move -> commit」が完了するのに1時間半かかりました。おそらく僕の人生の中で最も時間のかかったコミットとして全僕の中で語り継がれるのではないかと思います。 最近は弊社でも「最初に触れたバージョン管
「お前はvim派?それともemacs派?」「Xcode派」 社内で肩身の狭い思いをしているiOS担当のshobyです。Xcodeも慣れると使いやすいですよ。 さて、今回はGHUnitというテストフレームワークを用いて、非同期通信の単体テストを行う方法を紹介します。 GHUnitとは GHUnitとはMac OS X、 iOS用の単体テストフレームワークです。 Xcode標準のテストフレームワークであるSenTestingKitと互換性があり、 標準フレームワークには無い多くの便利な機能を持っています。 SenTestingKitと比べたGHUnitの利点は以下の通りです。 非同期処理のテストが容易 通信等のテストを簡単に記述できる 実機上でのテストが容易 アプリケーションとして端末上で実行される メモリ容量の制限等、ハードウェアに影響を受ける処理のテストを行える テストを部分的に実行可能
MacBook Proを買ったのはいいもののそろそろLinuxに戻りたくなってきたbokkoです。 今回は先月末にGoogleから発表・公開されたばかりのzopfliの紹介と、 そのPHP拡張であるphp-ext-zopfliにPNG画像を再圧縮する関数を追加した時の話をします。 zopfli zopfliはzlibと比べて3〜8%ほど圧縮率が高く、 それでいてgzipやzlib等で広く使われているdeflateアルゴリズムと互換性のある圧縮アルゴリズムです。Google CodeでCによる実装が公開されています。 繰り返しになりますが、単にdeflateアルゴリズムよりも圧縮率が高いだけでなく、 deflateアルゴリズムと互換性がある、つまりzopfliで圧縮したものは従来のgzipやzlibで展開できるというのがミソです。 zopfliによるPNG画像の再圧縮 PNG画像はデータ部分
先月からpixivの選考インターンに来ている@knmkrと申します。 インターンではbokkoさんのもと、 動的にサムネイルを生成するmod_small_lightを拡張する課題に取り組みました。 Github: mod_small_light (with GraphicskMagick) mod_small_lightによる動的サムネイル生成 pixivのように画像を大量に扱うwebサービスでは、サムネイルもまた大量に必要となります。大量のサムネイルを扱う場合、 サムネイルを保存するのに大容量のストレージが必要 サイトのデザイン変更に伴う新規サムネイルの生成コストが高い といったことが問題になります。 そこで、pixivでは一部のサムネイルは事前に用意せず、画像を配信する際にmod_small_lightでサムネイルに変換する「動的サムネイル生成」が行われています。 mod_small
こんにちは。Redmineのバックログ・プラグインが好きで「Redmine使いやすいですよね!」と言ったら「Redmineを使いやすいって言ってる人を初めて見た」と言われたedvakfです。今年はバックログの年にしたいです。 最近pixivのログイン前トップページが新しくなりましたね。イラストを全面に押し出したクールなデザインと、ウィンドウをリサイズしたりするとウニウニ動くアニメーションは新鮮だったのではないでしょうか。常にログインする設定の人も一度はログアウトして見てみてください。(アニメーションはCSSアニメーションに対応してるブラウザだけですが) 僕はその部分のリリースには関わってないんですが、コードを読んだりしてどんなことをしているのか解説したいと思います。 (注:2013年1月末時点での実装についての解説です) イラストデータ 使用するイラストは、現在は直近のランキングからランダ
あけましておめでとうございます。年末年始はひどい風邪でほぼ布団の上だったbokkoです。 しかし、布団の上でもプログラミングはできるので過去に自分が作ったnginxのモジュールのコードを直したり、 ngx_mrubyにPull-Requestを送ったりして過ごしていました。 そんな中・・・ 年が明けてもなかなか風邪が治らず、朦朧とした意識の中でngx_mrubyに機能を追加してnginx本体と 一緒にコンパイル & Valgrindで実行していると以下のエラーが出力されました。(nginxの拡張モジュールはnginx本体のビルド時に静的に組み込まれます) 1 2 3 4 5 6 7 8 9 10 11 12 13 14 ==21338== Conditional jump or move depends on uninitialised value(s) ==21338== at 0x44
こんにちは。 休日のゲームライフを充実させるため、せっせとエンジニアリングブログを書いています、ソフトウェアエンジニアのサイリュムです。 今回はpixiv.comのサーバ構成について簡単に紹介したいと思います。 国際版 pixiv.comのウェブアプリケーション部分はRuby on Rails 3.2系で作成しています。 ユーザとのやりとりを行うフロントエンド部分はRailsに任せ、データのやり取りや複雑なロジックは後述する内部APIに任せています。 nginx + unicorn Rackサーバにはunicornを使っており、nginx + unicornな構成を取っています。 nginxとunicornはunix domain socketで通信を行うようにしています。WEBアプリケーションサーバに乗っている静的なコンテンツはnginxが返し、動的ページへのリクエストはRailsが処理
HHKB Professional Type-Sが欲しいインフラ兼ソフトウェアエンジニアのbokkoです。 普段はHHKB Proの日本語配列キーボードを愛用しています。英語配列は苦手です。このことを同僚のエンジニアに言うとジト目で見つめられ・・・睨みつけられること請け合いです。 本連載の最後となる今回はpixivのデータストア/キャッシュ戦略を支える周辺ミドルウェアについて解説していきます。 memcachedからKyotoTycoonへ移行した際に発生した問題 前回の記事の最後にもあったようにpixivではAPの数だけあったmemcachedへのリクエストを少数のKyotoTycoonにまとめたことで一部のKyotoTycoonサーバへのTCPコネクション数が爆発してKyotoTycoonサーバのCPUやメモリリソースには余裕があるのにネットワークで詰まるという問題が起こりました。 元
このページを最初にブックマークしてみませんか?
『pixiv inside [archive]』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く