This document summarizes a microservices meetup hosted by @mosa_siru. Key points include:
1. @mosa_siru is an engineer at DeNA and CTO of Gunosy.
2. The meetup covered Gunosy's architecture with over 45 GitHub repositories, 30 stacks, 10 Go APIs, and 10 Python batch processes using AWS services like Kinesis, Lambda, SQS and API Gateway.
3. Challenges discussed were managing 30 microservices, ensuring API latency below 50ms across availability zones, and handling 10 requests per second with nginx load balancing across 20 servers.
This document summarizes a microservices meetup hosted by @mosa_siru. Key points include:
1. @mosa_siru is an engineer at DeNA and CTO of Gunosy.
2. The meetup covered Gunosy's architecture with over 45 GitHub repositories, 30 stacks, 10 Go APIs, and 10 Python batch processes using AWS services like Kinesis, Lambda, SQS and API Gateway.
3. Challenges discussed were managing 30 microservices, ensuring API latency below 50ms across availability zones, and handling 10 requests per second with nginx load balancing across 20 servers.
This slide describes an internal community on software engineering at Hitachi corporate group. Originally revealed at XP祭り2019 - conference on eXtreme Programming in Japan.
デブサミ2020 事業グロースを加速させる「分析基盤」の作り方 japantaxiMasatoshi Ida
デブサミ2020『事業グロースを加速させる「分析基盤」の作り方』にて、ホワイトプラス様と一緒に登壇させて頂きました
https://event.shoeisha.jp/devsumi/20200213/session/2387/
--
JapanTaxi, Inc. All Rights Reserved
102-0094 東京都千代田区紀尾井町3-12 3-12
TEL 03-6265-6265 FAX 03-3239-8115
https://japantaxi.co.jp/
文章·画像等の内容の無断転載及び複製等の行為はご遠慮ください。
37. Copyright (C) 2019 NIHON-Protec Co., Ltd. All Rights Reserved.
Reactの基礎:状態の局所化
Form
TextBox
Radio
Button
props props
props
state
コンポーネントに状態を
持たせることもできる
状態を持つ
コンポーネント
38. Copyright (C) 2019 NIHON-Protec Co., Ltd. All Rights Reserved.
Reactの基礎:状態の局所化
App
XXX XXX XXX
XXX XXX XXX XXX
props props props
props props props props
props
状態を最小限に抑える
state state
Reactアプリの
基本的な構成
39. Copyright (C) 2019 NIHON-Protec Co., Ltd. All Rights Reserved.
Reactの基礎:状態の局所化
• おさらい
– Reactは状態を極力持たない・扱わないような思想と仕組みを持っている
• 補足
– 親に値を渡すときはコールバックを使う
40. Copyright (C) 2019 NIHON-Protec Co., Ltd. All Rights Reserved.
Reactの基礎:状態の局所化
Form
TextBox
Radio
Button
props props
props
props = {
text,
onTextChanged
}
onTextChanged(“疋田”)
コールバックによる
値の引き渡し
state
70. Copyright (C) 2019 NIHON-Protec Co., Ltd. All Rights Reserved.
React採用時の注意点:パフォーマンス
• ほとんど完成してからパフォーマンス問題が発覚
– 開発者が使うマシンはスペックが高いので気づかなかった
– Reactに限らずSPA超あるある(辛い...)
Chromeで低スペックマシンをシミュレートしながら
地道に改善していった
71. Copyright (C) 2019 NIHON-Protec Co., Ltd. All Rights Reserved.
React採用時の注意点:パフォーマンス
Chrome開発者ツールの
Performanceタブで低スペック
CPUをシミュレートできる
72. Copyright (C) 2019 NIHON-Protec Co., Ltd. All Rights Reserved.
React採用時の注意点:パフォーマンス
• 大規模システムで初期表示時のパフォーマンスが問題になる場合は
コード分割(Code-Splitting)を検討しよう
Before After
Login Page A
Page B Page C
Page A
Page B Page C
Login
すべての画面のスクリ
プトがダウンロードさ
れる
実際に表示される画面
のスクリプトしかダウ
ンロードされない
73. Copyright (C) 2019 NIHON-Protec Co., Ltd. All Rights Reserved.
React採用時の注意点:認証
• 認証は今まで通りのCookie-Sessionベースでも十分
– JWTなどのトークンは扱いが難しい
• ログイン画面だけ別にするのもアリ
Login SPA
74. Copyright (C) 2019 NIHON-Protec Co., Ltd. All Rights Reserved.
React採用時の注意点:Reactの動向
• Reactは基本的にFacebookが自分たちのために作っている
• 我々はFacebookではないので、それいる!?みたいな機能も
• ただ、不要な機能は使わなければいいだけではある
(Reactは後方互換性をとても大事にする)
Concurrent ModeとSuspenseは追っておいた方がよいかも