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
揮発性の高いコンポーネントを作る話
Search
Chiaki Uehira
March 20, 2019
Technology
0
4k
揮発性の高いコンポーネントを作る話
Chiaki Uehira
March 20, 2019
Tweet
Share
More Decks by Chiaki Uehira
See All by Chiaki Uehira
個人と組織から考える自由な働き方について
uhck
0
79
ToDoリストを作ってる話
uhck
0
66
Nuxt.js + Firebaseで (最高の)ToDoリストを作った話
uhck
1
730
LaravelでGraphQLやってみた
uhck
0
1.4k
Vueコンポーネントについて考えてみた
uhck
0
1.8k
「PWA」とこれからのウェブ
uhck
0
120
Nuxt.jsとNetlifyで はじめるJAMstack
uhck
1
860
Other Decks in Technology
See All in Technology
DevOpsメトリクスとアウトカムの接続にトライ!開発プロセスを通して計測できるメトリクスの活用方法
ham0215
0
180
DevOpsDays History and my DevOps story
kawaguti
PRO
8
1.4k
プロトタイピングによる不確実性の低減 / Reducing Uncertainty through Prototyping
ohbarye
3
190
NgRx Signal Store
rainerhahnekamp
0
110
コンテナセキュリティの基本と脅威への対策
kyohmizu
3
680
長期運用プロジェクトでのMySQLからTiDB移行の検証
colopl
1
580
転移学習とドメイン適応の基礎
kmatsui
2
570
Aurora MySQL v3(MySQL8.0互換)の オンラインDDLの罠挙動を全バージョンで検証した
yutakikai
0
150
SIEMを用いて、セキュリティログ分析の可視化と分析を実現し、PDCAサイクルを回してみた
coconala_engineer
0
200
少数チームで挑む: SwiftUI, TCA, KMPを用いた 新規動画配信アプリ 「ABEMA Live」の開発について
tomu28
0
520
AWS パートナー企業でテクニカルサポートに従事して2年経ったので思うところをまとめてみた
kazzpapa3
3
1.3k
シン・Kafka / shin-kafka
oracle4engineer
PRO
6
2.7k
Featured
See All Featured
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
13
1.5k
Thoughts on Productivity
jonyablonski
57
3.8k
Fantastic passwords and where to find them - at NoRuKo
philnash
36
2.5k
Statistics for Hackers
jakevdp
789
220k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
75
41k
Making Projects Easy
brettharned
107
5.5k
BBQ
matthewcrist
79
8.7k
Agile that works and the tools we love
rasmusluckow
323
20k
4 Signs Your Business is Dying
shpigford
175
21k
Reflections from 52 weeks, 52 projects
jeffersonlam
343
19k
GitHub's CSS Performance
jonrohan
1023
450k
RailsConf 2023
tenderlove
1
530
Transcript
揮発性の高い コンポーネントを作る話 揮発性の高いコンポーネントに作る話 Chiaki Uehira https://uhck.in
揮発性の高いコンポーネントに作る話 合同会社ピクセルグラムの代表。大阪を中心にウェブの プログラマー・デザイナーとして活動しています。解 析・改善を含めた制作を得意としています。 Chiaki Uehira Programmer / Designer https://uhck.in
https://pixelgram.jp https://twitter.com/_uhck
揮発性の高いコンポーネントに作る話 ダイアログのような、一時的にそのときだけ必要になるもの を揮発性の高いUI・コンポーネントっていうみたいです。ほ かにも、ツールチップとかポップアップとかもそう。 揮発性の高い コンポーネントとは
揮発性の高いコンポーネントに作る話 事前にダイアログのコンポーネントを仕込んでv‑ifで切り替 えてるパターン。 管理画面など、ロジックが複雑な画面になるとテンプレート の中にダイアログのコンポーネントがずらずら並んでくる。 よくある実装
揮発性の高いコンポーネントに作る話 グローバルメソッドでダイアログを呼び出したい。ダイアロ グを閉じるとPromiseが返ってくるようにしたい。 揮発性の高いコンポーネントはコンポーネントツリーに常駐 してる必要はなく、必要になったら動的に追加され、役目を 終えると削除される。 理想
揮発性の高いコンポーネントに作る話 1. メンテナンスの性の向上。 2. テンプレートの中を軽くする。 3. Stateやローカルdataの圧迫させない。 Element UIのNotice系は同じような実装になっている。 なぜそうするのか
揮発性の高いコンポーネントに作る話 実装方法 グローバルメソッド
揮発性の高いコンポーネントに作る話 実装方法 コンポーネント
揮発性の高いコンポーネントに作る話 実装方法 呼び出し
揮発性の高いコンポーネントに作る話 https://github.com/in‑the‑box/vue‑dialog DEMO
揮発性の高いコンポーネントに作る話 1. テンプレートの中身が複雑化しない 2. 関数でどこからでも呼び出せる 3. Promiseでかえってくるのでその後の処理も楽になる まとめ
揮発性の高いコンポーネントに作る話 ご静聴 ありがとうございました。
None