Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
設計例 (ODC) : EventでUIから重たい処理を切り離す
Search
Junji Watanabe
July 26, 2024
Technology
0
290
設計例 (ODC) : EventでUIから重たい処理を切り離す
OutSystems東京開発者コミュニティ 2024/07/25
Junji Watanabe
July 26, 2024
Tweet
Share
More Decks by Junji Watanabe
See All by Junji Watanabe
OutSystems CoEチームの技術的サポート
junjiwatanabe
0
18
生成AIのODC周辺開発(External Logic)への適用例
junjiwatanabe
0
150
Mentor 生成アプリの構造解析
junjiwatanabe
0
100
Web Developer Specialist (ODC)
junjiwatanabe
0
100
ODC向けAI Mentor System
junjiwatanabe
0
150
認定資格の取り方
junjiwatanabe
0
600
Other Decks in Technology
See All in Technology
ビギナーであり続ける/beginning
ikuodanaka
3
720
生成AI活用の組織格差を解消する 〜ビジネス職のCursor導入が開発効率に与えた好循環〜 / Closing the Organizational Gap in AI Adoption
upamune
7
5.1k
本が全く読めなかった過去の自分へ
genshun9
0
930
Lufthansa ®️ USA Contact Numbers: Complete 2025 Support Guide
lufthanahelpsupport
0
150
KubeCon + CloudNativeCon Japan 2025 Recap
ren510dev
1
370
さくらのIaaS基盤のモニタリングとOpenTelemetry/OSC Hokkaido 2025
fujiwara3
3
380
Tech-Verse 2025 Keynote
lycorptech_jp
PRO
0
1.8k
CursorによるPMO業務の代替 / Automating PMO Tasks with Cursor
motoyoshi_kakaku
2
930
2025-07-06 QGIS初級ハンズオン「はじめてのQGIS」
kou_kita
0
160
ドメイン特化なCLIPモデルとデータセットの紹介
tattaka
2
580
Beyond Kaniko: Navigating Unprivileged Container Image Creation
f30
0
130
DBのスキルで生き残る技術 - AI時代におけるテーブル設計の勘所
soudai
PRO
23
7.9k
Featured
See All Featured
How STYLIGHT went responsive
nonsquared
100
5.6k
Six Lessons from altMBA
skipperchong
28
3.9k
Into the Great Unknown - MozCon
thekraken
39
1.9k
Become a Pro
speakerdeck
PRO
28
5.4k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.4k
Testing 201, or: Great Expectations
jmmastey
42
7.6k
StorybookのUI Testing Handbookを読んだ
zakiyama
30
5.9k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.7k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
8
680
For a Future-Friendly Web
brad_frost
179
9.8k
The Straight Up "How To Draw Better" Workshop
denniskardys
234
140k
Reflections from 52 weeks, 52 projects
jeffersonlam
351
20k
Transcript
設計例 (ODC) : EventでUI から重たい処理を切り離す OutSystems東京開発者コミュニティ 2024/07/25 OutSystems MVP 渡部
潤司 : https://qiita.com/jyunji_watanabe : https://twitter.com/JyunjiW : https://www.linkedin.com/in/watanabejyunji/ Qiita X LinkedIn
本日の内容 1. ODCのEventとはなにか 2. Eventを使った設計例
1. ODCのEventとはなにか
ODCにおけるEventとは(イメージ) 他App イベントハンドラー (Server Action) 他App イベントハンドラー (Server Action) ②Action
FlowでEvent を発生させる (処理はそのまま継続 ⇨つまり非同期) ①ODC Studioの Eventsタブの下で作成 するプログラミング要素 ③Eventを参照し、発生 時のイベントハンドラー をApp毎に作成できる
ODCにおけるEventとは • App内で何らかの事象が発生したことを示すプログラミング要素(Eventsタブの下にある) • Eventを参照しておくと、そのEventが発生したときに自動で実行されるServer Action (Event Handler 。タイムアウトは2分と短め)を指定できる(これをSubscribeと呼ぶ) •
Subscribeは複数のAppから行える • Eventを発生させるにはTrigger EventをAction Flowに配置 • 重要なのは、 ◦ Eventを発生させる側と、Eventを受け取って動く側を切り離して非同期に処理できる ◦ 他のApp等のEvent Handlerに対してPushで操作を起動できる(なお、試してみた範囲では、起動にかかる時 間はOutSystems 11におけるLight BPTと遜色なく、ほぼ一瞬だった) Light BPTはEntityのCreateに呼応する Actionを書ける機能
Eventの使い所例 • 非同期で発生するイベントを待ち受ける • 小さなバッチ(タイムアウトが2分であることに注意) • Sagaパターン(コレオグラフィー) ◦ Sagaパターンは、複数のサービスにまたがるトランザクションを、ローカルトランザクションのつながりとして実現する ◦
コレオグラフィーは、この複数サービス間のやりとりをMessage Broker経由で行うので、まさにEventはODC上でこ の仕組みを実現するのにうってつけ ◦ Sagaが必要な設計をすると、構築・保守共に大変になりそうなので避けたいところではある • UIから重たい処理を分離し、非同期で処理する 今日は個々の例を見ていきたい
2. Eventを使った設計例
こんなアプリケーションを運用していたとする Excelからレコードを読み取る レコードをループして処理 1レコードあたりおよそ100ms 処理結果を返す Server Action Excelファイル をアップロード Excelファイルには大体200レコード
1レコードあたり100msなので、200 x 100ms ≒ 20秒 余裕を持ってServer Request Timeoutは30秒に設定
実装例 Sleepで「重たい処理」をシミュレート
「最近アップロードに失敗することがある。その場合は繰り返し てもだめなのでファイルを分割して対応している」という問い合 わせ ⇨調べてみると、アップロードされるファイルサイズは拡大傾向 で、今後も増えることが想定される こんな状況になったらどうするか? Server Request Timeoutは上限1分
Eventを使った対応例 Excelからレコードを読み取る レコードをDBに登録しEvent をTrigger 1レコードあたりおよそ100ms 処理状況EntityのIdを返す Server Action1 ①Excelファイ ルをアップロー
ド 処理状況 Entity Excelレコード Entity ②Excelの中身はDBに 登録し、すぐに制御をUI に戻す ③UIでは定期的(5秒と か)で処理状況を確認 Server Action2 ④Subscribeし ているハンドラ ーが起動 ⑤登録され ているデー タを処理
実装例①:事前準備 処理状況 Entity Excelレコード Entity Excelファイル内の各行が1レコードに対 応する Excelファイルのアップロードが行われた ことを通知するEvent イベントハンドラーが処理
対象のレコードを知るた め、参照を持たせておく
実装例 Entityにレコードを登録し、 EventをTriggerしたらす ぐに終わる イベントハンドラー:Entityか らレコードを取り出し、ループ で処理する 適当なところでステータスを 更新してコミットする
もちろん他の修正案もある 1. Eventの代わりにTimerを利用 ◦ 定期実行で複数のアップロードファイルを一括処理でいいとき 2. アップロードしたデータをEntityに登録するまではEvent案と同じだが、登録した結果は画面に 表示し、それを確認したユーザーが別のボタンをクリックすると取り込み処理を起動する ◦ Entityへの登録と、その後のループ処理が同じような処理時間であれば、この方法でもうまくいくかもしれない
3. クライアント側でファイルを分割し、ループ処理する ◦ Excelのまま読むなら、何らかのライブラリが必要になるかもしれない ◦ アップロードするファイルをCSVにできるならもっと楽かもしれない 選択肢を把握して、要件に合わせた方法で 実装するのが大切
以上