タグ

ブックマーク / devpixiv.hatenablog.com (5)

  • pixiv Sketchのフロントアーキテクチャ - pixiv inside [archive]

    (ピクシブ株式会社 Advent Calendar 2016 12日目の記事です) qiita.com こんにちは、エンジニアの id:geta6 です。普段は主にpixiv Sketchの開発などに携わっています。 さて、先日ISUCON6の選が開催され、ISUketchというReactを使ったお絵かきサービスが話題になったかと思います。 この問題で採用されたアーキテクチャは『pixiv Sketch』のアーキテクチャを参考にしたものとなっています。 パフォーマンス等に関しましては選の感想として良質な記事がいくつも執筆されていますのでそちらに譲るとして、今回はこのアーキテクチャの設計意図や利点について話します(2年前のリリース当初からずっとこの構成なので今さら感はありますが)。 どういうアーキテクチャか pixiv SketchのWeb版は、2つのサーバーから構成されています。 1つ

    pixiv Sketchのフロントアーキテクチャ - pixiv inside [archive]
  • pixivのサムネイル事情 - pixiv inside [archive]

    この記事はピクシブ株式会社Advent Calendar 12/10の記事です。 こんにちは、インフラチームの@harukasanです。 さて、今日はpixivで使用しているサムネイル変換サーバについて紹介しようと思います。 pixivにはたくさんのサムネイルがある pixivにはうんざりするほどたくさんの種類のサムネイルがあります。 これは対応しているプラットフォームが多く、また画面毎にもサイズが異なるからです。 PC版であるwww.pixiv.netだけでも10種類以上のサムネイルが使用されています。 また、サムネイルにはアスペクト比を固定したものと、スクエアにクロップした2種類があります。 (Ugoira Tech Talks: Ugoku Backendより) 従来の方法ではこれらのサムネイルをアップロード時に生成していたため、サムネイル生成を非同期化するなどして対応していました。

    pixivのサムネイル事情 - pixiv inside [archive]
  • ISUCON6出題チームが社内ISUCONを開催!AMIも公開!! - pixiv inside [archive]

    ISUCON6の出題者の1人の@catatsuyです。 GW直前の4/28、年度入社の新卒エンジニア全員と社内のエンジニアほぼ全員が参加するイベントとして社内ISUCONを開催しました。 同じく出題者の1人である@edvakfの記事でも書いたように、今年のISUCON6では株式会社はてなさんと弊社で共同出題する予定です。 inside.pixiv.net 今回は弊社のISUCON6出題チームの4人で開催した社内ISUCONの様子を紹介します。 社内ISUCON 時間は12:30から19:00まで行いました。営業日に会社のエンジニアのほとんどが参加するイベントなので、午後を割り当てる形にするぐらいが良いのではないでしょうか。今回は新卒研修の一環としての側面があったので、新卒エンジニアにはISUCON事前ハンズオンとしてこのような内容の講義を行いました。 初期実装 初期実装の言語は『Ruby

    ISUCON6出題チームが社内ISUCONを開催!AMIも公開!! - pixiv inside [archive]
  • フロントエンドで知っておきたい要素指定の考え方 - pixiv inside [archive]

    みなさんはじめまして、ピクシブのフロントエンドエンジニア id:koharusugiura です。 JavaScript を用いた開発を行う際に jQuery や Reactvue.js といったライブラリーを使う方は多いでしょう。これらのライブラリーは共通して DOM を扱うライブラリーとなります。 DOM についての説明は長くなるのでここでは省きますが、簡単に説明すると HTML や XML の構造を表現するための仕様です。DOM は JavaScript のためだけにある仕様ではなく、 JavaPython など、多くの言語に対応する仕様です。 前述した各ライブラリーは多くのウェブブラウザー間の差異を吸収してくれるため、非常に便利なものです。しかし、その機能の豊富さからライブラリー自体のサイズは大きく、ウェブブラウザーで読み込むファイルの数や合計の容量が増えてしまいます。状況

    フロントエンドで知っておきたい要素指定の考え方 - pixiv inside [archive]
  • CORSでハマったことまとめ - pixiv inside [archive]

    こちらは ピクシブ株式会社 Advent Calendar 2014 の12/16の記事です。 こんにちは、エンジニアの@dnskimoです。 先日、はじめてCORSを実装する機会があったので、覚書がてらまとめておきたいと思います。 CORSとは Cross-origin resource sharingの略です。 読み方は「コルス」でいいんでしょうか? Same-Origin Policyに弾かれずに、異なるドメイン間でリソースを共有する仕組みです。 2014年1月にW3C勧告になり、JSONPに替わる方法として徐々に普及してきているようです(要出典)。 アクセスコントロールの仕様も定義されているので、特定のサイトからのみ利用可能なAPIを作る際などに便利です。 JSONPのような「裏ワザ」的な方法ではないところも個人的に好みです。 詳しいことはネット上に素晴らしい記事がたくさんあるので

    CORSでハマったことまとめ - pixiv inside [archive]
  • 1