3Dモデルの配信サーバーでRustとZstandardを採用して数倍のパフォーマンス向上を実現した - pixiv inside
はじめに こんにちは、VRoid部所属のエンジニアのyueです。 この度VRoid Hubで3Dモデルの配信サーバーの見直しを行い、技術選定から始めRustとZstandard (zstd)を採用した実装に切り替えました。 結論から見るに従来のNode.js製サーバーと比べて以下のことを実現しました。 最大のレスポンス時間が 1.5 ~ 2.5s から 300 ~ 400msまで低下 平均のレスポンス時間が 700 ~ 800ms から 150 ~ 200msまで低下 サーバーのCPU使用率が ~ 50% から ~ 10%まで低下 docker image のサイズが ~ 346mb から ~ 21mb程度まで削減 配信されるファイルサイズが平均 10 ~ 20% 軽量化されました レスポンス時間 CPU使用量 (上からAVG(MAX), AVG, AVG(MIN)) メモリー使用量に関し
DroidKaigi 2023 の企業ブースでお配りした同人誌の内容を公開します - pixiv inside
みなさんこんにちは、技術広報室のkamikoです。 2023年9月14日（木）〜9月16日（土）に開催されたDroidKaigi 2023にゴールドスポンサーとしてスポンサーシップを行い、企業ブースの出展を行いました。 本日はカンファレンス中のブース施策と、ブースで配布していた同人誌の内容を公開させていただきたいと思います。 当日のブース施策 ブースでは3つの施策をご用意させていただきました。 施策の思想については、先日掲載した記事を参考にしていただけますと幸いです。 inside.pixiv.blog 1. パネル掲載 過去のAndroidの変遷を追いながら、ピクシブがどのように追従してきたのか分かりやすく年表にまとめました。 その他、ピクシブにおけるAndroid開発とその技術詳細をお伝えしたく、イラスト・マンガ・小説の投稿サービスpixivと、女性向け漫画サービスPalcyの技術スタ
ピクシブにおける不当な目的での作品取得行為に対する対策技術について - pixiv inside
CTOのharukasanです。 pixivをはじめとするピクシブが運営している各サービスにおいて、ユーザーの投稿した作品を不当な目的を持って取得する行為から守ることは、プラットフォームとして重要な責務のひとつであるとピクシブは考えています。これまでもピクシブでは、作品が不当な目的で大量に取得されないよう機械的なクローリングを検知し、ブロックするために様々な手段を講じてきました。この記事では、現在行っている対策と、今後実施していくために現時点で取り組んでいる施策についてご説明します。 English version is available here これまでに実施している不当な目的での作品大量取得への対策について ピクシブでは不当な目的で作品を大量取得されることを防止するため、基本的な対策に加え、様々なソリューションを導入しています。ここでは特徴的な技術についていくつかの例を紹介します。
The PHP Foundationへの寄付を開始しました - pixiv inside
こんにちは、うさみ(@tadsan)です。標記の通り、ピクシブ株式会社はThe PHP Foundation(@ThePHPF)への継続的な財政支援を開始しました。 opencollective.com 支援額は月間1000ドル、年間で12000ドルになる計画です。 PHPは言わずと知れたオープンソースのプログラミング言語処理系であり、誰もが無料で自由に利用できます。そのため、多くの個人ホームページ、ウェブサイト、百科事典、ゲームのAPIサーバー、広告システム、大規模な業務システムに至るまで世界中の多くのプログラムがPHPで稼動しています。 西暦2000年前後においてはLinux, Apache (HTTP Server), MySQL, P* (Perl, PHP, PythonなどPから始まるプログラミング言語)による構成はLAMPスタックと呼ばれ、無料のソフトウェアの組み合せによって
津の片隅からファイバーなしでライブ配信する技術 #rubykaigi #ruby_music_mixin - pixiv inside
こんにちは、CTOのharukasanです。CTO以外にImageFluxのプロダクトオーナーもやっています。 ピクシブは三重県津市で開催されたRubyKaigi 2022にMusic Lounge Sponsorとして参加しました。 Ruby Music Mixin ピクシブでは最終日2022/09/10 (土)にRuby Music Mixinというラウンジを提供させて頂きました。Ruby Music Mixinについては別にalitasoが記事を書いてくれたのでそちらをご参照ください。 inside.pixiv.blog Ruby Music Mixinのトリをつとめる弊社若手の様子 RubyKaigi 2022は感染症対策のため三重県津市の会場とオンラインのハイブリッドで開催されました。これにあわせ、Ruby Music Mixinも物理ラウンジに加え、オンラインラウンジとして配信
pixivをNext.jsでリプレイスする取り組みをご紹介します。 - pixiv inside
pixivではNext.jsを用いたフロントエンドのリプレイスプロジェクトを2022年3月末より行っており、現時点(2022年8月)でリクエスト機能をNext.jsにてリプレイスしました。 今回のpixiv insideではピクシブ株式会社で働くエンジニアの取り組みとして、pixivのフロントエンドをNext.jsでリプレイスする取り組みについて実際に取り組んだメンバーからご紹介します。 まずは皆さんの自己紹介をお願いします namazu: pixivのウェブ領域に関するテックリードを担当しているnamazuです。今回のNext.js化プロジェクトではPjMやNext.jsのホスティング回りの実装を担当しています。 shu: 2022年3月に入社したshuです。Next.js化ではフロントエンドの設計、実装を担当しています。 mog: エンジニアとしてアルバイトをしているmogです。Nex
ParamHelperにPSR-7とValueObject の力を授けた話 - pixiv inside
こんにちは、VTuberとPHP をこよなく愛しているふじしゃんです。 去年の7月からpixiv運営本部 Webエンジニアリングチームでアルバイトをしています。 今回は、pixivのParamHelperにPSR-7とValueObjectの力を授けたRequestParamFilterをピクシブ百科事典に実装した話を書いていきます。 ParamHelper について これまでピクシブ百科事典には、リクエストパラメータやリクエストボディを厳密に検証する仕組みがありませんでした。 Webアプリケーションにとって入力値検証は非常に重要なことです。 pixivでは、受け取った値を安全に扱うためにParamHelperという機能を実装し、必ず検証するようにしています。 以下のように書くことで値を検証しPHPStanで型付けを行うことができます。 <?php $page = ParamHelper:
pixivのブックマークに関する負荷対策をしました - pixiv inside
10/22(金) 追記 この記事で解説している内容について解説する勉強会を開催することとなりました。以下のconnpassよりお申し込みください。 pixiv.connpass.com 10/22(金) 追記 pixivのブックマークについて ブックマークDBの問題について 具体的な対策内容 論理削除廃止・index追加・ブックマークタグのテーブル分割 適応ハッシュインデックスの無効化 アプリケーションコードのリファクタリング・全発行クエリの列挙と見直し 大きな更新処理の非同期化 結果 あわせてよみたい pixivではサービスの成長に伴い、気に入った作品に対して付けることができるブックマークの総数が急速に増加しており、ユーザーの皆様に滞りなくサービスを提供し続けるためブックマークに関するデータベース(以後DB)の負荷対策が必要になりました。 2021年2月より対策を行うプロジェクトを発足し
PIXIV DEV MEETUPでお話した「ブランディングページの 世界観を表現する技術」のセッション資料公開 - pixiv inside
エンジニアのyui540です。 PIXIV DEV MEETUPで「ブランディングページの世界観を表現する技術」というタイトルで、私が今まで関わってきたPIXIVプロダクトのブランディングページを実装するにあたって、サービスの世界観を表現するのにどのような動き・技術的な工夫をしたのかをご紹介しました。 もっとページの世界観を表現するブランディングページがインターネットに増えてほしいのでセッション資料を公開します。 yui540 2019年4月新卒入社。マーケティング&ユーザグロース部プレミアムサービス部所属のCSSエンジニアをしています。特技はCSSアニメーションを使って、バチバチに動くWebサイトを作ること。
uGUI記述ライブラリ『Mux』を公開します - pixiv inside
こんにちは。VRoid モバイル/StudioのUIを開発したねこまんまです。 先日VRoid モバイル/Studioで利用しているuGUI記述ライブラリ『Mux』を公開しました🎉 github.com 実は以前、pixiv TECH SALONで少しだけ紹介させていただいたのですが、今回はこのライブラリの魅力をより掘り下げて見たいと思います🔍 uGUI? uGUIとはUnityのアプリケーションで使うことができるUIツールキットです。他にもUnityには、新しく開発されているUI ToolkitやUIWidgets、サードパーティーによるものなど様々なものがあります。uGUIはその中でも成熟しており、Unityに標準的に含まれることからよく利用されています。 uGUIの特徴は、Unityのヒエラルキーに則ってUIが構築されることです。そのため、Unity Editorを用いて編集する
PIXIV TECH FES.のLPを支えるCSSアニメーションテクニック - pixiv inside
※本記事に出てくるアニメーションは全てCSSで作られています はじめまして、新卒エンジニアの yui540(@yui540)です。普段は、pixivFANBOXというサービスのCSSエンジニアをしています。 今回は、私がコーディング&ページ演出のアニメーションを担当させていただいたPIXIV TECH FES. の LP(第一弾)の CSSアニメーションの実装方法を一部解説します。 第一弾 conference.pixiv.co.jp 第二弾 conference.pixiv.co.jp とその前に、「PIXIV TECH FES.って何？」という方もいると思うので、簡単にご説明します。 PIXIV TECH FES. は、私たちピクシブのエンジニアが普段からお世話になっている方や、 お話ししてみたい方をお招きして、サービス開発で得た技術的知見とピクシブの未来についてお話しするテックカンフ
文字レイヤーを支える技術 - pixiv inside
こんにちは、型と複雑GUIが大好きな @f_subal です。 普段は pixivFACTORY というサービスでフロントエンドをやっています。 さて、早速スクショでお見せしていますが、 今年の3月に pixivFACTORY のグッズ編集画面はリニューアルしました。 すでにこちらの記事でも紹介がありましたが、 新しい画面では、画像のみならず文字を使ったデザインができるようになっています。 フォントワークス および MonoType の書体が 100 スタイル分利用可能です。 文字だけでの制作も可能ですので是非ご利用ください。 https://factory.pixiv.net/item_groups/new 今回は、このテキスト入力機能のフロントエンド実装、 特に React と SVG でいかに文字レイヤーを表現するかについてご紹介したいと思います。 SVG にとって文字レイヤーとは何
Closedなesaの記事URLをSlackに貼ったら展開されるようにした - pixiv inside
みなさんこんにちは。@FromAtomです。去年のアドベントカレンダーでは、 『【esa】社内ドキュメントツールのホッテントリを分かるようにしたら捗った話 』を書きました。今年もesaの話です。以前、中の人にインタビューしていただいた こともあるのですが、ピクシブではesaという情報共有サービスを利用しています。 社外秘の情報も書かれているためClosedなesaとして運用しており、もちろん外部の人はアクセスすることができません。そのため、Slackにesaの記事URLを貼っても展開機能が使えません。「それはそう」という感じなのですが、下の画像のPublicなesaのように、URLが展開されたほうが便利ですよね。 そこで、Slack AppのUnfurling links in messagesという機能を利用して、社内Slackに貼られたClosedな社内esaのURLでも展開できるよう
Flutterで社員研修用のアプリを作った話 - pixiv inside
みなさんはじめまして。初めてじゃない方はお久しぶりです。ピクシブでAndroidアプリエンジニアをしておりますconsommeです。 ピクシブでは基本的に年一回、社員同士の交流を深めるという目的のもと、社員研修を開催しています。2018年は2泊3日の沖縄研修が計画されました。そのなかで研修運営チームから「社員研修で使うアプリを作れないか？」という相談を受けました。 研修中は基本的にチーム行動になるので、自分のチーム以外の人が何をしているかがわかりづらい。それなら各自で研修中に撮った写真を共有して、みんなで楽しめれば社員同士の交流につながるのではないか、そのためのアプリが欲しい、とのこと。 そう言われるとアプリエンジニアとしては作らないという選択肢はありません。ぜひやりましょう、ということで、社員研修を盛り上げるためのアプリを開発することになりました。 システム構成 アプリ側 アプリはFlu
BOOTH iOSアプリはどうやって有料ダウンロード商品の販売を解禁したか？ #booth_pm #booth - pixiv inside
2020/12/25 編注：この記事は2018年当時のエピソードです。現在はこの方法では審査に通らなくなりました。 おばんです、給料日であることをいいことに、にじさんじくじに課金しまくったBOOTH iOSエンジニアの @danbo-tanaka です。 平素よりBOOTH iOSアプリをご贔屓いただき、ありがとうございます。 みなさんもうアプリをアップデートしていただけましたでしょうか？ 8月16日(木)にリリースしたv2.12.0では、これまで要望の多かった有料ダウンロード商品の販売を実装しました！🎉 これまでiOSアプリにおいて、デジタルコンテンツの購入に対応したアプリは多くありませんでした。それはAppleが用意したアプリ内課金（通称Apple税。手数料として30%をAppleに支払う必要がある支払い方法）を通さなければ、基本的にデジタルコンテンツの取り扱いが許されなかったという
Swagger+JSON SchemaでAPIの型をテストして開発サイクルをスピードアップさせた話 - pixiv inside
CTO兼福岡オフィス立ち上げ担当として新アプリを作っている@edvakfです。 JSON APIを開発しているとこういう問題がありがちですよね。 仕様どおりにAPIの形式を作ったはずだけどなんか自信が持てない テストでいくつかのキーが存在するかの簡単なチェックはしてるつもりだけど、全部チェックするのは大変すぎる APIのControllerやViewをリファクタリングしたらレスポンスの形が変わってアプリがめっちゃクラッシュし始めた というのが怖くて誰もリファクタリングできなくなった APIドキュメントがメンテされない 知らない間にレスポンスのフィールドが増えてたけどドキュメントに書いてない これらを解決したい！と思って試行錯誤したら、スマートに解決することができました。この記事ではRailsのことについて書きますが、考え方は他の言語・フレームワークでも同じです。 なお、今回使ったgemのバ
pixivを常時HTTPS化するまでの道のり（前編） - pixiv inside
ピクシブ株式会社で開発基盤チームとして働いている @catatsuy です。主にpixivの技術的な改善をしていますが、広告チームも兼任しているので広告周りの開発もしています。 今回pixivの常時HTTPS化を担当したのでやったことを紹介します。 pixivをHTTPS化した理由 現在のインターネット全体の流れとして常時HTTPS化が進んでいます。エドワード・スノーデン - Wikipediaが暴露したNSAの事件発覚や 公衆無線LANの利用拡大により、通信経路上でユーザーの個人情報を保護することがインターネット全体として非常に重要になってきました。Googleが行っている調査によると、HTTPSページの閲覧時間はウェブ全体の利用時間の3分の2にも及びます。 それだけではありません。ブラウザに新しく追加されるAPIや機能（HTTP2/WebRTC/ServiceWorkerなど）はHTT
実際に運用してみてわかった、大規模Mastodonインスタンスを運用するコツ - pixiv inside
おはようございます、ImageFlux開発責任者のharukasanです。3日前の4月14日、ピクシブではPawooが急にリリースされることになりまして、ここ数日はずっとPawooサーバにログインしていました。このPawooサーバ、既にピクシブの監視体制に入っており、アラート受信後インフラエンジニアが障害対応できる仕組みを整えています。案の定、リリース直後の15、16日は週末にもかかわらずアラートを受け取ることになり、サーバにはりつくことになったわけです。どんなシステムであろうとアラートを受け取ったら対応する、それが我らインフラエンジニアです。 pawoo.netの構成 さて、それではまずPawooの構成を見ていきましょう。digすればわかりますがpawoo.netはAWS上に構成されています。数百台以上の物理サーバを常時運用しているピクシブであっても、さすがにこんなにはやく物理サーバは用
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
