LoginSignup
0
0

More than 5 years have passed since last update.

デブサミ2016感想

Last updated at Posted at 2016-02-20

はじめに

イベント名 Developers Summit 2016
参加日 20160218(木、初日のみ)

今年は初日のみ、4セッション聴講してきました。
去年はSparkメインに聴きましたが、今年はJS中心です。
初投稿です、間違い等々ありましたらご指導のほどよろしくお願いしますm(_ _)m

大規模 SPA ( Single Page Application ) を TypeScript と AngularJS を駆使して5ヶ月で作った話

スピーカー 山田 直樹[株式会社リクルートマーケティングパートナーズ]
職種 FE&デザイナー
資料 http://www.slideshare.net/wakamsha/how-to-develop-a-huge-single-page-application
所感 開発時に意識すべきことまで盛り込まれた有意義なセッションだった

要点

  • プルリクは他の作業を止めてでもなる早対応
    • 待ちは無駄。
  • 開発しながら並行してリファクタリング
    • 上記二つにより、相手のコードも理解できる。
    • レビューやリファクタを重ねるにつれ、次第にメンバーのコード作法が似てくる。
    • するとレビューにかかる時間が劇的に減り、メンバー全員がシステムの全体像を理解した状態が生まれる
  • 新卒が優秀だった
    • わからないことは聞き合う・教え合う
      • 教える方はどんな初歩的なことでも嫌がらずに丁寧に答える
    • 結果、気さくに議論できるようになりプラスに大きく働いた
      • これは実践したいと思う一方で、メンバー間に知識差やモチベーションに左右されそう。足の引っ張りあいにならないよう、まずは学びの文化を作らないと。

内容詳細 with 独り言

  • 英語サプリのWEB版をSPAで作ったお話
  • 企画当初の山田氏のJSスキルセットは、CoffeeScript/jQuery/Vue.js
  • Vue.jsはAngularJSから機能を削ぎとってシンプルにしたものらしい
    • Angularの開発者が作ったので思想は同じ、学習コストの低いVue.jsをやった後にAngularを再学習すると理解しやすい
  • SPAでやることは決まっていたので、仕様が固まるまでは技術調査
    • 記法:TypeScript/Babel
      • TypeScriptを選択。理由は静的型付けでコンパイル時にエラーチェックできることの安心感。多人数で開発するなら必須。
    • フレームワーク:AngularJS/React/BackBoneJS
      • AngularJSを選択。学習コストは高いが、AngularJS+UI Routerのルーティングは強力
      • Reactはライブラリであってフレームワークではないと心の中で突っ込んでみたり
    • タスクランナー:gulp/grunt
      • gulpを選択。プログラムっぽくタスク定義できるので力押しの条件分岐が可能
        • この後webpackが流行ってくるが、webpack vs gulpはjavaでいうmavenとgradleみたいなもの
        • そしてjavaで未だmavenが主流のように、webpackが勝ち残った模様。みんな設定が好きなのだ!
  • 数ヶ月たっても固まらない仕様、現場に来ないプロジェクトオーナー、ガラスのハートで憔悴していくリーダー
    • 缶詰めで仕様を決める。80%まで固め、新卒と二人で開発開始
  • 開発方針は要点参照
  • 最後にはAndroid/iOS開発チームのメンバーにも手伝ってもらった
    • 専門外でも、コードを読めばわかると言ってくれた頼もしい人たち
  • リリース直前にIE9で動かないことがわかった
    • 他サービスでのIE9ユーザー数を調査
    • 全体の8%......微妙な数値
    • リーダー「よし、切ろう」
  • 無事リリース

JavaScript.trend(spec) /* 最新言語仕様を軸とした JavaScript の最先端解説 */

スピーカー 浅井 智也 [Mozilla Japan]
職種 dynamis(デュナミス)さん
資料 http://www.slideshare.net/dynamis/java-scripttrendspec
所感 前半はJSの歴史、中盤は新文法の話、最後はコンパイルの仕組みの話。技術の話オンリーだが、ブラウザベンダーの人が話すJSの話だから安心して聞ける。

要点

  • 最新仕様は現在の仕様のシンタックスシュガーに過ぎないが、その価値は大きい
  • ECMAScript2017でついにAsync/Await(by C♯)が実装される

独り言 without 内容詳細

  • ECMAScriptの読み方は「エクマスクリプト」
  • JSの仕様はmozillaの人が一週間で作った。良い設計だったとは思ってない。
  • ES5からES6にかけて、ECMAScriptの仕様書は250pから500pになった。つまり今のJSしか知らないということは、JSの半分も使いこなせていないということである。
  • 「まつもとゆきひろ コードの未来」でも思ったが、やはりJSのコンパイル面は魔境の域に達している
    • 型推論によりCの半分、JAVA以上の速度が実現されうる
    • ゲーム業界の多くでもJSは輝きを放っている

大規模Redisサーバ縮小化への戦い

スピーカー 駒井 祐人[アカツキ]
職種 BE&インフラ
資料 http://www.slideshare.net/ssuserf3788f/redis-58419914
所感 問題発生、調査、仮説、対策、解決……と思いきやまた問題発生

内容詳細

  • Redisとは
    • インメモリデータベース → 高速
    • 5種類のキー/バリューのデータ型
    • ファイル永続化オプション → 信頼性
  • AWS EC2が20台に対し、Redis(AWS ElasticCache)64台を運用
    • リリース時、Redisの負荷が高まったので64台にスケールアウト
    • しかしkeys("*")、つまり全てのサーバにリクエストしていた
    • 増やした意味なし。レビューや負荷テストで気付けたのに
  • 月135万円のコスト
    • 減らしたい
  • 現状把握のためデータの件数を一覧化
  • 同じ件数の箇所がいくらかあった。中は同じデータだった
    • スケールアウト当時、コピーでノードを増やしたため
    • その後使われていないノードのデータはゴミが溜まったまま
  • マージ方法は?
    • Redisのドキュメント
      • 記載なし
    • AWSのドキュメント
      • 記載なし
    • Github上のそれっぽいツール
      • makeが通らないw
  • 我流マージ案
    1. key/valueデータを抜き出して別のDBへ
    2. dumpファイルを結合
  • 案2は計算量がすくなく高速マージできそうだし、ヘッダ・フッタだけ触ればいけそう
  • dumpファイルの構造
    • スライドを見て分かる通り機械語w
    • ヘッダ+DB番号A+データA+DB番号B+データB+......+フッター
    • 二種類のdumpファイルをマージするには......
      • Redis1=(ヘッダ1+DB番号1A+データ1A+DB番号1B+データ1B+......+フッター1)
      • Redis2=(ヘッダ2+DB番号2A+データ2A+DB番号2B+データ2B+......+フッター2)
    • フッター1とヘッダ2を削除して繋げればいけそう?
      • この辺の推測の仕方は真似たい
  • 試す
    • 失敗!
    • よく見るとフッター2でDB数やデータ数の確認をしていた
  • フッターを修正して再チャレンジ
    • 成功!
  • 上記検証後、本番で実施
    • 成功、1Redisサーバーで扱うDB数を増やすことでRedisサーバー数を9割削減
    • コストが月38万円と100万円ダウン!
  • ところが数週間後、再びエラー
    • コネクション上限
    • コネクション数 = サーバ数×プロセス数×DB数
    • 1Redisサーバー当たり複数DB使うようにしてしまったため、最後の掛け算の分、接続数が激増
  • リソースに余裕があるのでお金で解決するか
    • AWSの仕様書を見たら、Redisの接続数の上限は変更不可となっていたorz
  • DB数を減らす必要に迫られる
    • 先の案1で複数DBのデータを一つのDBへと寄せる
    • 時間がかかるが、並列化などでどうにか成功!

Yahoo! JAPANの実践から学ぶ、超大規模Webシステムのフロントエンドとインフラ

スピーカー 柴田 和祈 [ヤフー]、伊藤 拓矢 [ヤフー]
職種 デザイナー、インフラ
資料 まだなし
所感 何故JSとインフラの話を一緒にしたし。後半、両隣寝てたよぉ......

要点

  • AngularJS/Reactが人気
    • AngularJS/React化できているプロダクトは全体の2割り程度
  • 最新技術は半年から1年様子をみる
    • 未来も残る技術を選ぶべき

企業ブースなど

  1. GHE

    • 日本最大はYahoo!Japan
    • NASAでも開発者が世界中に散らばっているため採用されている
  2. Atlassian

    • JIRAでインベーダーゲームができる
      • 一服用
      • ターゲット数はPJメンバー数。ピンク色のターゲットはPM
      • 会場でトライしたら44秒でした
  3. サイボウズ

    • ジャングルカフェ:無料自販機と無料バナナと無料Wifi
      • 重宝しました。でもこういう気前がいいやつは、来年にはなくなってるんだよなぁ
0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0