entry-header-eye-catch.html
entry-title-container.html

entry-header-author-info.html
Article by

pixivコミックのAndroidアプリを支える技術

こんにちは、kobakenです。以前こんなことを話していましたが、現在絶賛Composeしております!

今回はpixivコミックのAndroidアプリを支える技術を紹介していきたいと思います。

pixivコミックとは

pixivコミックでは、アニメ・映画化の話題の漫画からpixivコミックオリジナル作品まで7000作品以上が無料で読める!

といったサービスです。

チーム構成

ピクシブでは基本的にプロダクトごとにチームが結成されており、エンジニアやデザイナー、企画運用やマネージャーなどがセットで一気通貫した開発を行っています。

pixivコミックチームは現在Androidエンジニアが3名在籍しており、各人がプロジェクトを持って進めています。私が去年の10月ごろにpixivコミックチームに異動してきたことによる開発リソース増加により、新しい技術の導入や運用改善に着手する余裕が生まれてきて、活気ある開発が続けられています。

基本情報

pixivコミックの基本的な要件はこんな感じです。

minSdk: 26
compileSdk: 33
targetSdk: 33
フルKotlin

採用しているアーキテクチャ

Googleが推奨するアーキテクチャガイドに倣って実装しています。各層を繋ぐインターフェースとしてKotlin Coroutines Flowを活用していますが、古いコードではRxJavaが混在していることもあります。新規実装もしくは既存機能の改修の際には、状況に応じてCoroutines化を進めています。

ライブラリ

pixivコミックで採用している主要なライブラリをざっとまとめてみました。

Android Jetpack

- androidx.core:core-ktx
- androidx.appcompat:appcompat
- androidx.preference:preference-ktx
- androidx.datastore:datastore-preferences
- Room
  - androidx.room:room-runtime
  - androidx.room:room-rxjava2
  - androidx.room:room-compiler
- androidx.multidex:multidex
- lifecycle
  - androidx.lifecycle:lifecycle-runtime
  - androidx.lifecycle:lifecycle-extensions
  - androidx.lifecycle:lifecycle-common-java8
  - androidx.lifecycle:lifecycle-viewmodel-ktx
  - androidx.lifecycle:lifecycle-livedata-ktx
- androidx.paging:paging-runtime-ktx
- androidx.activity:activity-ktx
- androidx.fragment:fragment-ktx
- androidx.recyclerview:recyclerview
- androidx.constraintlayout:constraintlayout
- androidx.viewpager2:viewpager2
- androidx.cardview:cardview
- androidx.core:core-splashscreen
- com.google.android.material:material
- Jetpack Compose
  - androidx.activity:activity-compose
  - androidx.compose.material:material
  - androidx.compose.foundation:foundation
  - androidx.compose.ui:ui
  - androidx.compose.ui:ui-tooling-preview
  - androidx.compose.ui:ui-tooling
- androidx.work:work-runtime-ktx
- androidx.work:work-rxjava2
- androidx.annotation:annotation
- androidx.browser:browser

基本的にViewModelからActivity/Fragmentへの通知にはLiveDataを採用しています。

また、DroidKaigiのGo Takahanaさんによる発表に触発されて一部実装でDataStoreを採用しています!既存のSharedPreferencesによる実装をDataStoreに置き換える作業なども順次行っていく予定です。

そして、Jetpack Composeの導入も進めています。新規の画面は積極的にComposeで実装していく方針です。好きなComposeはScaffoldです(Slot APIすばらっ!)。 公式からBOMが公開されているのでそちらでバージョン管理をしています。

その他のGoogle製ライブラリ

  • Google Play Billing Library

ストア機能で利用する専用コインを購入するために利用しています。

Kotlin

- org.jetbrains.kotlin:kotlin-reflect  
- org.jetbrains.kotlinx:kotlinx-coroutines-core  
- org.jetbrains.kotlinx:kotlinx-coroutines-android  
- org.jetbrains.kotlinx:kotlinx-coroutines-rx2
- org.jetbrains.kotlinx:kotlinx-serialization-json:1.3.2

基本的に非同期処理ではKotlin CoroutinesやKotlin Coroutines Flowを採用しています。

通信系

  • OkHttp
    安心安全のHTTPクライアント実装です。

  • Retrofit
    安心安全の(ry

  • Picasso
    歴史的経緯でPicassoを使い続けています。

  • Fetch
    ファイルダウンローダーとして採用しています。

UI系

  • Groupie
    複数種類のRow Typeを扱う複雑な画面の場合に活用しています。Row Typeが1種類でシンプルな場合は標準のListAdapterを使っています。

  • Charcoal
    ピクシブのデザインシステムのAndroid向け実装系です。最近OSSになりました。Jetpack Composeにも順次対応中です。

デバッグ系

  • LeakCanary
    メモリリークを検出する際に活用しています。

  • Hyperion
    デバッグ時に便利な項目をアプリ内に埋め込める便利ライブラリ。 標準搭載されているメニューをいくつか採用しています。 pixivコミックでは以下のようなカスタムメニューを実装しています。

    • ログイン情報を削除する
    • ダミーのActivityを表示する(新規画面を実装する際に便利)
    • 広告切り替え
    • ログイン中のpixivユーザーIDを確認する
  • Timber
    デバッグ時のロギングに使っています。

テスト系

  • Spek
    Rspecのようにテストを記述できるKotlinのテストフレームワークを採用しています。

  • Mockk
    モック化に利用しています。

その他

  • Firebase
- firebase-messaging-ktx
- firebase-analytics-ktx
- firebase-dynamic-links-ktx
- firebase-config-ktx
- firebase-perf-ktx
- firebase-inappmessaging-ktx
- firebase-crashlytics-ktx

push通知や設定、解析やクラッシュ検知など幅広い活躍中!公式からBOMが公開されているのでそちらでバージョン管理をしています。

  • RxJava2/RxBinding3
    古い実装系で扱われています。LiveDataやCoroutinesの辺りで「基本的には」と触れていたのはこの存在があるからです。 順次LiveDataやKotlin Coroutines Flowに置き換えています。

  • kotlinx-coroutines-rx2
    RxなコードをCoroutinesに変換できる便利なやつ。 修正の影響範囲を最小化するために利用します。

  • Dagger
    DIコンテナとして採用しています。後述しますが、Hiltに置き換えたいと思っています。公式ではDagger Hiltを使うことをおすすめしているのでそのうち乗り換えようと検討しています。

  • ThreeTenABP
    Java8から導入されたJSR-310の実装系であるThreeTenのAndroid用バックポートライブラリです。

  • Gson
    JSON<->Java/Kotlinのオブジェクトのパーサーです。こちらも歴史的経緯で使用し続けています。MoshiかKotlin Seriealizationに移行したい…。

  • EventBus
    任意の画面へイベント通知をするために利用しています。

  • jsoup
    HTMLの解析に利用しています。

  • 広告系SDK各種
    各所に表示するための広告用SDKをいくつか採用しています。

BitriseによるCI/CD

ピクシブではスマホアプリのCI/CDツールとしてBitriseを採用しています。pixivコミックでも主にテストやデプロイ作業の自動化により日々の開発で恩恵を受けています。

弊社とBitriseについて詳しくはこちらの記事をどうぞ。

bitrise.io inside.pixiv.blog

豊富なステップとGUIによる手軽なワークフロー構築が魅力的ですね!

その他のチーム内外での取り組み

pixivコミックの開発では1週間1スプリント単位のスクラム開発を取り入れています。週の初めにやることを決めて、終わりに振り返りを行います。またチームの共通認識として、スプリント内の10%をリファクタリングや新技術の導入など内部品質向上タスクとして自由に使っても良いというルールがあります。これにより気兼ねなくコミットしていくことが出来ています!

また隔週開催の互助会では、pixivコミックを開発していく上での悩みや導入したいと思っているライブラリや技術の相談を行っています。

最近導入したJetpack Composeの理解を深めるためのお触り会も開催しており、実際に調査したり手を動かす実装者のみならず、レビュワーになりうる人も日々Composeの知識を取り込めるようにするための工夫をしています。

またチーム外では他部署のAndroidエンジニア陣を集めたAndroidの会というものを隔週開催しています。詳しくは過去の記事をご覧くださいませ。

inside.pixiv.blog

一緒にpixivコミックを盛り上げよう!

ここまで読んでいただきありがとうございました!

ピクシブではpixivコミックを盛り上げてくれるAndroidエンジニアを絶賛募集しております。興味を持ってくれた方はぜひ下記エントリーフォームよりご応募お待ちしております!

hrmos.co

「転職機運はないけど、ピクシブのAndroidエンジニアとカジュアルに話してみたいな〜」という方は下記フォームから気軽にエントリーしてくださいね!

hrmos.co

それでは今回はこんなところで。

またの機会ノシ

20191219012714
kobaken
2017年10月新卒入社。声優案件やpixivコミックのAndroidアプリ開発を担当しています。チームのムードメーカー的存在。ハヤテのごとく!が人生のバイブル。最近はポケカに夢中。座右の銘は「常にユーザであれ」