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
Riot.js Tokyo #2
Search
h2so5
February 02, 2017
Programming
0
710
Riot.js Tokyo #2
h2so5
February 02, 2017
Tweet
Share
More Decks by h2so5
See All by h2so5
Dripcap03
h2so5
2
350
Goによる P2Pチャットシステムの開発
h2so5
11
6.8k
Other Decks in Programming
See All in Programming
Hack Claude Code with Claude Code
choplin
4
2k
PipeCDのプラグイン化で目指すところ
warashi
1
270
PHPで始める振る舞い駆動開発(Behaviour-Driven Development)
ohmori_yusuke
2
390
Hypervel - A Coroutine Framework for Laravel Artisans
albertcht
1
120
LT 2025-06-30: プロダクトエンジニアの役割
yamamotok
0
760
XP, Testing and ninja testing
m_seki
3
240
システム成長を止めない!本番無停止テーブル移行の全貌
sakawe_ee
1
200
AIと”コードの評価関数”を共有する / Share the "code evaluation function" with AI
euglena1215
1
160
Composerが「依存解決」のためにどんな工夫をしているか #phpcon
o0h
PRO
1
250
#kanrk08 / 公開版 PicoRubyとマイコンでの自作トレーニング計測装置を用いたワークアウトの理想と現実
bash0c7
1
770
git worktree × Claude Code × MCP ~生成AI時代の並列開発フロー~
hisuzuya
1
570
Python型ヒント完全ガイド 初心者でも分かる、現代的で実践的な使い方
mickey_kubo
1
110
Featured
See All Featured
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
130
19k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
107
19k
The Straight Up "How To Draw Better" Workshop
denniskardys
234
140k
Building Applications with DynamoDB
mza
95
6.5k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
60k
Agile that works and the tools we love
rasmusluckow
329
21k
Code Review Best Practice
trishagee
69
18k
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
Facilitating Awesome Meetings
lara
54
6.4k
Visualization
eitanlees
146
16k
Building Better People: How to give real-time feedback that sticks.
wjessup
367
19k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
3.9k
Transcript
Ron Hashimoto Developing a plug-in system with github.com/h2so5
github.com/dripcap/dripcap
+ Electron Background:
Simple and elegant component-based UI library
a.tag b.tag c.tag d.tag Component-based plug-in system
Run-time compiling let tag = riot.require(“view.tag”); 1 Server-side API
Loading styles riot.util.styleManager.inject(); 2
Dynamic mounting <virtual data-is={ tag }> </virtual> 3
Layout? Problem:
None
layout-bottom layout-top layout-list layout-session
<grid-container> opts.center.tag opts.top.tag opts.bottom.tag opts.right.tag opts.left.tag
<tab-container> <grid-container each ={ item, i in opts.items }> tab1
tab2
let container = Layout.container(‘layout-bottom’); container.append({ center: { tag: 'binary-view' },
name: 'Binary' }); Tab name Mounting tagName <tab-container/> Position
Problem 1: Conflicting tag names
<packet-view> <packet-view-layer> <packet-view-item> <packet-view-boolean-value> <packet-view-integer-value> <packet-view-string-value> <packet-view-buffer-value> <packet-view-stream-value> <packet-view-custom-value> <log-view>
<log-view-filter> <log-view-item> <packet-list-view> <packet-filter-view>
Problem 2: Server-side API pollution
document.createElementNS = document.createElement lib/server/sdom.js Conflicting with D3.js
Object.defineProperty(document, 'createElementNS', { value: document.createElementNS } );
None