タグ

ブックマーク / mixiengineer.hatenablog.com (37)

  • Amazon EC2 リザーブドインスタンスの利用状況をDatadogで監視する(AWS Summit Tokyo 2017 で発表してきました) - mixi engineer blog

    はじめまして。北村です。 先日行われた AWS Summit Tokyo 2017 で、Datadog 様の EXPO セッション枠の一部を頂いて SNS「mixi」における Datadog 活用事例について紹介させていただきました。 speakerdeck.com 今回は、その発表の中で紹介させていただいた EC2 リザーブドインスタンスの管理・購入を支援する以下の自作ツールについて紹介をしたいと思います。 github.com ツールの概要 先にツールの概要を解説しますと AWSAPI から得られた EC2 インスタンスの稼働状況とリザーブドインスタンス契約情報を集計し 稼働中のインスタンス数 有効なリザーブドインスタンス数 オンデマンドインスタンス数 未使用状態のリザーブドインスタンス数 以上の推移を、Datadog 上でリアルタイムで可視化するというインスタンス集計プログラム

    Amazon EC2 リザーブドインスタンスの利用状況をDatadogで監視する(AWS Summit Tokyo 2017 で発表してきました) - mixi engineer blog
    ryshinoz
    ryshinoz 2017/06/13
  • 総行数57,000の巨大CSS群をLessに書き換えた軌跡 - mixi engineer blog

    こんにちは!フロントエンド闇祓いの Kuniwak です。 この投稿はmixiグループ Advent Calendar 2015の20日目の記事です。 今年の9月に、スマートフォン Web ブラウザ版 mixi「mixi Touch」の巨大 CSS を Less (CSS プリプロセッサー)でビルドする環境へと移行しました。 書き換えた CSS の行数は、なんと 56,725行 です。😵 ということで、今回は弊社の大規模 CSS → Less 移行事例についてお話しします。 背景 スマートフォン版 mixi は、2010年5月に始まりました。 この頃のスマートフォンは、iPhone 端末であれば iPhone 3GS、Android 端末であれば Nexus One という時期です。 また、スマートフォンの世界では、Webkit ベースのブラウザーが席巻していた時代ということになります。

    総行数57,000の巨大CSS群をLessに書き換えた軌跡 - mixi engineer blog
    ryshinoz
    ryshinoz 2015/12/21
  • 2日でできる! JavaScript トレーニング - mixi engineer blog

    こんにちは。SNS mixi の JavaScripter、kuniwak です。 新しい仲間たちが入社する季節になりましたね。 さて、ミクシィを支えるエンジニアが作成した JavaScript 研修の資料を Github にて公開しました。 ミクシィは 2013年から研修資料を公開していましたが、今年は JavaScript の進化に合わせて内容を刷新しています! 2015年度の JavaScript 研修は、Web アプリケーションの部品(モジュール)をつくれるようにすることを目標とした、実践的な研修として計画されました。 JavaScript 研修のために与えられた期間は2日ということもあり、MVC や Flux といった設計方面の話題には踏み込めていませんが、Promise、Fetch API、Bower など、現在・未来のフロントエンド開発に必須の要素を盛り込んだ最新のJavaS

    2日でできる! JavaScript トレーニング - mixi engineer blog
    ryshinoz
    ryshinoz 2015/04/18
  • 理想の開発環境 - mixi engineer blog

    たんぽぽグループの森です。 一日の半分近くを机に座ってすごすエンジニアにとって、快適な開発環境は切実な問題です。 外界からうけるストレスを極力排除し、効率よくフロー状態にはいることと、フロー状態を長く維持することはとても重要です。 お前は今までに購入したキーボードの数をおぼえているのか?と突っ込まれてもしかたが無いキーボード遍歴を重ねましたが、KINESISに出会い キーボードに関してはまぁまぁ満足することができました。 机・椅子・マウス・ディスプレイとまだまだ欲望は果てしないのですが、今回のミクシィ社の引越しに伴い、エンジニアの机と椅子にオカムラ社のクルーズ&アトラスが選定され、机と椅子に関してもかなりの満足度を得ることができたので自慢報告します。 クルーズ&アトラスの御紹介 クルーズ&アトラスはオカムラ社が販売している低座・後傾姿勢を特徴としたパーソナルワークステーションです。 2

    理想の開発環境 - mixi engineer blog
    ryshinoz
    ryshinoz 2014/05/17
  • OpenStackとLXCを導入した話 - mixi engineer blog

    こんにちは、運用部 アプリ運用グループの清水です。Golang鋭意勉強中です。 今回は、SNS「mixi」に限った話ではなく、ミクシィ社全体として利用している仮想環境について紹介したいと思います。パブリッククラウドも一部のサービスで利用していますが、今回は、自社で運用している仮想環境にフォーカスして書いてみようと思います。 今まで利用してきた仮想環境 今まで利用してきた仮想環境というと、手作業で構築したKVM(Kernel-based Virtual Machine)環境が中心でした。手作業といってもある程度手軽に構築できるように、シェルスクリプトとCobblerでVMを構築できるようになっています。構築の流れは以下のとおりです。 CobblerにVMのIPやホスト名などをスクリプトで登録する。 KVMのホスト上でスクリプトを実行(koanコマンドでCobblerと連携してVMをセットアッ

    OpenStackとLXCを導入した話 - mixi engineer blog
    ryshinoz
    ryshinoz 2014/03/31
  • 社内研修「JavaScript基礎」の資料を公開します! - mixi engineer blog

    どうも、新卒2年目エンジニアJavaScript委員会の重田です。 帰省がてら鳥取砂丘や小豆島に行ったらだいぶ日に焼けてしまいました。 さて、もう4ヶ月ほど前になってしまったのですが、新卒研修でJavaScript基礎の講師を担当したので、そのときの資料を公開します。加えて、JSを学ぶ上で押さえておくとよいポイントを解説します。 研修資料 https://github.com/mixi-inc/JavaScriptTraining JavaScript初心者向けの資料になります。 JavaScriptに触れるのがはじめての人でも、配属後すぐに活躍できるようになることを目指して研修を実施しました。 デベロッパーツールで素早くトライ&エラーを繰り返し、JSを学ぶ 去年ぼくはこの研修を受ける立場でした。今年の講師を担当するにあたって、研修の進め方で最も変えたのはデベロッパーツールを積極的に使う

    社内研修「JavaScript基礎」の資料を公開します! - mixi engineer blog
  • Android開発の効率を今日から確実に5%改善する方法 - mixi engineer blog

    暖かくなったり寒くなったり視界が真っ黄色になったり忙しい今日この頃ですが、皆様お元気でお過ごしでしょうか。動かないことで定評のある「右の方」raiです。mixiのAndroidクライアントアプリ初回リリース以来の登場です。部署もたんぽぽグループからイノベーションセンターという謎の組織へ移りました。大変ご無沙汰しております。 今回は、ミクシィにおけるAndroidアプリ開発現場で得られた経験から、意外と見えづらい開発プロセス上のボトルネックと、それを「いますぐ」「簡単に」改善できる、素敵なサービスについて簡単にご紹介したいと思います。 はじめに さて、ミクシィもAndroidアプリ開発を始めてから2年半ほどが経ちました。 2年も経つと、結構いろんな課題が見えてきて、それらに対する解決策もいくつか生まれます。 Androidプラットフォーム上での開発そのものに関して言えば、以前のエンジニアブロ

    Android開発の効率を今日から確実に5%改善する方法 - mixi engineer blog
    ryshinoz
    ryshinoz 2013/03/13
  • Androidの機種依存問題を吸収するプロジェクトAndroid-Device-Compatibilityを公開したお話 - mixi engineer blog

    こんにちは。Androidユニットで開発とスクラムマスターをしています、横幕です。すっかり寒くなって、朝起きるのが辛い季節になりました。 先日、Android(TM)の様々な機種に依存する問題を吸収するためのライブラリプロジェクトをmixi, IncのGitHubリポジトリで公開しました。 今回は、このライブラリプロジェクトを公開するに至った経緯をお話しようと思います。 様々な種類の端末に対応するために乗り越えてきた困難 現在、Androidを搭載した端末には、多種多様なものがあります。 そして、OSのバージョンごとの違いだけでなく、同じAndroidを搭載していても、端末ごとに微妙に挙動が異なることがあります。 mixi公式クライアントアプリでも、端末ごとに微妙に挙動が異なることで発生する問題にいくつか直面してきました。 特定の端末で、文字が9,000文字までしか入力できない EditT

    Androidの機種依存問題を吸収するプロジェクトAndroid-Device-Compatibilityを公開したお話 - mixi engineer blog
  • mixiのサーバOS移行のお話 - 前回補足&インストール編 - mixi engineer blog

    こんにちは。新しもの好きが集まる運用部アプリ運用グループの清水です。 前回の記事では、多くの反響をいただきました。ありがとうございます。 Twitterや、はてブのほとんどのコメントを読ませていただきました。 みなさんのOSの宗派が垣間見えた気がします。 さまざまなコメントをいただいていた中で、よくある代表的なコメントについて、改めてこの場を借りてお答えしたいと思います。 2012年12月28日追記: 以下のQAにつきまして、いわゆる"ネタ"として書きましたが、誤解を招き、不適切な表現で不快な思いをされた方々へ深くお詫び申し上げます。 また、QAの一部に関わるところですが、OS標準のパッケージを否定するつもりは全くございません。 Linuxを安心して使うことができるのは、Linuxディストリビューションに携わっているデベロッパーの方々の素晴らしい活動や成果によるもの、というのが揺るぎない事

    mixiのサーバOS移行のお話 - 前回補足&インストール編 - mixi engineer blog
    ryshinoz
    ryshinoz 2012/12/27
  • isucon2に参加してきました。 - mixi engineer blog

    こんにちは、ゾンビ映画が大好きだけど怖くて一時停止しながらじゃないと見れない森@たんぽぽグループです。 isucon2に参加してきました。 事前調査と方針決定 公開されていたisuconのソースと参加チームのblogを読み、どういう方針で行くかを相談しました。 正攻法だとある程度の改善はできるけども優勝は狙えないだろう。 ということでチートを目的とすることにしました。 チート方法 偽情報 twitterに「AKB48が渋谷ゲリラライブやってるよ! #isucon2」などと流す。 考えただけで実際には実行はしませんでした。 2位狙い reverse proxyの接続先を優勝候補チームのreverse proxyに向ける。 ※今回はIPアドレスの下2桁がチーム番号だったので推測可能でした。 upstream fujiwara { server xxx.xxx.xxx.xxx } server

    isucon2に参加してきました。 - mixi engineer blog
    ryshinoz
    ryshinoz 2012/11/06
  • Perl Oceanとmixiのチャット機能トライアルの紹介 - mixi engineer blog

    大槻唯が好きすぎて辛いlapis25です.エンジニアブログをはじめて書きます. この記事では,リアルタイムコミュニケーションフレームワークスイート Perl Oceanの紹介と,Perl Oceanを用いて開発した,mixiのチャット機能のトライアルについて紹介したいと思います. XMPP まずは,Perl Oceanのコア技術である,XMPPの概要を軽く説明します. 1990年代後半からYahoo! Messenger,Microsoft LiveやAOL AIMなどさまざまなメッセンジャアプリが開発されていましたが,それらのアプリは独自の仕様によって作られていました.メッセンジャに要求される仕様を標準化するためにJabberが生まれました.Jabberは名前をXMPP(Extensible Messaging And Presence Protocol:拡張可能なメッセージとプレゼンス

    Perl Oceanとmixiのチャット機能トライアルの紹介 - mixi engineer blog
    ryshinoz
    ryshinoz 2012/09/26
  • mixi の解析基盤とApache Hive での JSON パーサの活用の紹介 - mixi engineer blog

    こんにちは.最近ピクルス作りで精神統一をしている,たんぽぽグループ解析チームの石川有です. このブログではお馴染みのたんぽぽグループですが,"No More 「刺身の上にタンポポをのせる仕事」 - 単純作業の繰り返しで開発者の時間を浪費しないために。"というミッションを持っています.その中で解析チームは,データ解析基盤の構築,データマイニング,データ解析の社内コンサルティングを行ない技術からの改善を担当しています. 今回の記事では,mixi における解析基盤について簡単に触れたあと,その基盤における「刺身の上にタンポポをのせる仕事」をどう減らすかの2点について書きます. mixi の解析基盤 まずは解析環境について,簡単にお話します.2012-08 現在 mixi では,主な解析用のツールとしては,Apache Hadoop, Hive を利用しています.またあわせて,自分など一部の人は,

    mixi の解析基盤とApache Hive での JSON パーサの活用の紹介 - mixi engineer blog
    ryshinoz
    ryshinoz 2012/08/09
  • m AD 広告配信の裏側 - mixi engineer blog

    はじめまして! たんぽぽグループのよしもとです。 時が経つのは早いもので、バカボンのパパと同い年になりました。 mixi では昨年、mixi ページ・コミュニティの参加者を増やすための広告サービスとして、 m AD(エムアド) β version をリリースしました(以下 m AD と略します)。 今回は m AD の広告配信について書こうと思いますので、 m AD のサービス内容にご興味をもたれた方はこちらを参照してくださいね!! 要件 広告配信を行う配信サーバの要件としては、 多数のリクエストを高速に処理 リクエスト毎に複雑な配信条件から最適な広告を選択 などがありあます。 これらの要件を満たすために、 高性能なサーバを使用し処理時間を短縮 多数のサーバを用意し、単位時間あたりに処理できるリクエスト数を増加 などの対応を行う事が多いです。 m AD の広告配信では、さらに最適な広告の選

    m AD 広告配信の裏側 - mixi engineer blog
  • mixi Engineers' Blog » 詳細 ECMA-262-3 シリーズ・第1章 実行コンテキスト/第2章 変数オブジェクト

    初めましてこんにちは。たんぽぽグループの大形尚弘と申します。好きな言語は Dart です。どうぞよろしくお願いします。 さてもう昨年のことになりますが、私個人のブログにて、 Dmitry A. Soshnikov さんの JavaScript. The Core. という記事を翻訳させていただきましたところ、予想以上の反響をいただきました。 JavaScript の実装部分、例えば今なら HTML5 の色とりどりな API といったキラキラした部分だけでなく、 ECMAScript の仕様そのものに興味のある方が、こんなにいたなんて! と、いうわけで、日では、先日上梓されました『パーフェクト JavaScript 』でのみ触れられているような、 ECMAScript の言語仕様そのものについて、同じく Dmitry さんが書かれた ECMAScript3 および 5 に関する詳細記事シリ

    mixi Engineers' Blog » 詳細 ECMA-262-3 シリーズ・第1章 実行コンテキスト/第2章 変数オブジェクト
  • Sinon.JS を使った JavaScript のテスト - mixi engineer blog

    初めましてこんにちは。ソーシャルクライアント開発の tanabe と申します。 今回は?Sinon.JS を使った JavaScript のテスト方法を紹介したいと思います。 Sinon.JS って何? Sinon.JS はノルウェーのエンジニア Christian Johansen さんが書かれた、JavaScript 用のライブラリです。スタブやモック、フェイクオブジェクトの提供に特化していて、QUnit などのテスト用のフレームワークや実行環境に依存しない所が特徴です。Christian Johansen さんは?Test-Driven JavaScript Development の著者でもあり、こちらは近々翻訳版 が登場するようです。 では早速、Sinon.JS を使ったテスト手法をご紹介していきたいと思います。稿ではテストフレームワークは QUnit を採用しています。 時間

    Sinon.JS を使った JavaScript のテスト - mixi engineer blog
  • Apache Solr を利用した検索パッケージ Anuenue - mixi engineer blog

    研究開発グループの takahi-i です。 先日名前だけご紹介したAnuenue というツールをご紹介させていただきます。Anuenue は Apache Solr のラッパーであり、検索クラスタの構築と運用を容易にする目的で制作されました。 稿では始めに Apache Solr を選択した理由について述べ、その後、このツールを開発した背景とその目的をご紹介させていただきます。後半では実際に Anuenue を用いて検索クラスタを立ち上げます。 なぜ Apache Solr を採用したのか 昨年の秋、弊社の検索エンジンを置き換えるという計画が社内で策定され、ベースとなる検索エンジンの選定のために多くの OSS 検索エンジンを比較検討しました。このとき重視したのは一台の検索パフォーマンスと同時に、保守の容易さと、開発コミュニティの規模です。 検索エンジンの保守性に関して特に重要と考えたの

    Apache Solr を利用した検索パッケージ Anuenue - mixi engineer blog
  • Jenkins はじめました + ほか3つ - mixi engineer blog

    こんにちは。加藤和良です。 まずあの話を書いて、それを前提にあの話を書いて、みたいなキューが筆者の中にはあったのですが、正直キューの先端につまってる話はだんだん個人的な関心および記憶がうすれてきました! 昔のはなしですからね。 というわけで、最近のまとめをさらっと書いて、新しいネタをすぐ書ける状態にリセットしたいと思います。 Jenkins mixi ではバージョン管理システムとして Subversion を使っています。安定した、いつでもリリースできるバージョンを trunk に、開発中の機能は branches 以下に作業ブランチをつくり、レビューや QA などの後に trunk にマージする、という運用です。 Buildbot はこのうち trunk だけを追っていたのですが、徐々に「このブランチBuildbot で追うようにして、結果をこの IRC チャンネルに書きこんでほしい

    Jenkins はじめました + ほか3つ - mixi engineer blog
  • mixi Engineers' Seminar #1の報告 - mixi engineer blog

    Nitendo 3DSで遊ぶのは戦国無双クロニクル、PS3で遊ぶのは真・三国無双6と、なにかを断ち切るかのように敵を切りまくっているmilanoです。 お気に入りは甄姫です。 もうずいぶんと前のことな気がしてしまいますが、3/3の雛祭りの日に行われたmixi Engineers' Seminar #1にお越しいただきましたみなさま、どうもありがとうございました。 当日使われた資料と動画を公開します。 ちなみに、今回のテーマはスマートフォン周りのお話しあれこれでした。 Objective-C一巡り Objective-Cひとめぐり View more presentations from Kenji Kinukawa ミクシィの衣川憲治より、WebエンジニアがObjective-Cを学習するメリット、Objective-Cの特徴などについて話しました。 GREEHTML5とiOS+Andr

  • Flash?いいえ、HTML5です: ファイルのドラッグ&ドロップによるフォトアップロード機能について - mixi engineer blog

    はじめまして。コミュニケーションサービス開発部の澤と申します。コーヒーカレーをこよなく愛する新卒2年目の新米エンジニアで、弊社Webのフロントエンドを主に担当しています。最近はmixiスマートフォン版(mixi Touch)の開発にも精力的に取り組んでいます。 さて、日はPC版のmixiで1つの機能をリリースいたしました。ファイルをWebブラウザにドラッグ&ドロップするだけで写真をmixiフォトにアップロードできるもので、HTML5 File API※1を採用しています。記事ではこの機能について色々とお話をしたいと思います。 なにこれ? 以下では、ドラッグ&ドロップによるアップロード機能を「機能」と呼びます。 百聞は一見にしかずです。機能のプロモーションムービーがありますので、まずはこちらをご覧ください。 動画では下記を説明しています。 従来のアップロード方法からドラッグ&ドロッ

    Flash?いいえ、HTML5です: ファイルのドラッグ&ドロップによるフォトアップロード機能について - mixi engineer blog
  • mixi の年末年始対策 2009-2010 - mixi engineer blog

    こんにちは。パートナーサービス部の加藤和良です。 2008年末に、mixi の年末年始対策について紹介しました。今回は、ここ数年の年末年始対策の歩みと、今年の対策について紹介したいと思います。実をいうと、設計も実装も自分じゃなかったりするのですが、このまま歴史に埋もれていくのも悲しいので、関係各所に取材してみました。 2008年末をふりかえる まずは、2008年末をふりかえってみましょう。 あのころはまだ mixi の機能も少なく、年末年始の負荷は主に日記に集中していました。そこで当時は ID Generator の改善 - mod_perl をあいだにはさんで MySQL への接続数を減らす 最新情報DBへの書き込みを非同期に - Q4M をつかって負荷を時間軸で分散する という2つを日記に実装したのでした。 しかし、2008年末から2009年のお正月にかけて、mixi はまたも日記に

    mixi の年末年始対策 2009-2010 - mixi engineer blog
    ryshinoz
    ryshinoz 2011/01/09