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
On the evolution and changes of Riotjs@4
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
kkeeth
March 22, 2019
Programming
740
2
Share
On the evolution and changes of Riotjs@4
kkeeth
March 22, 2019
More Decks by kkeeth
See All by kkeeth
Programming to play with p5.js
clown0082
0
85
とある EM の初めての育休からの学び
clown0082
1
5.5k
The history of Javascript frameworks: changes in front-end design philosophy
clown0082
2
220
Visually experience the beauty of mathematics with p5.js
clown0082
1
3.3k
Rediscover the joy of coding with Creative Coding
clown0082
0
1.9k
全員が意思決定する会社で開発者体験や生産性を見る大変さについて
clown0082
0
660
JavaScript × Mathematics go to Digital Art
clown0082
1
450
In-house study group at YUMEMI
clown0082
0
240
Playing Ionic Logo by p5.js
clown0082
0
340
Other Decks in Programming
See All in Programming
ソースコード→AST→オペコード、の旅を覗いてみる
o0h
PRO
1
130
AI時代のエンジニアリングの原則 / Engineering Principles in the AI Era
haru860
0
1.2k
Spec-Driven Development with AI Agents (Workshop, May 2026)
antonarhipov
3
340
20年以上続くプロダクトでも使い続けられる静的解析ツールを求めて
matsuo_atsushi
0
140
クラウドネイティブなエンジニアに向ける Raycastの魅力と実際の活用事例
nealle
2
250
Cache-moi si tu peux : patterns et pièges du cache en production - Devoxx France 2026 - Conférence
slecache
0
350
AI時代になぜ書くのか
mutsumix
0
360
20260514 - build with ai 2026 - build LINE Bot with Gemini CLI
line_developers_tw
PRO
0
400
ソフトウェア設計の結合バランス #phperkaigi
kajitack
0
500
実用!Hono RPC2026
yodaka
2
310
いつか誰かが、と思っていた フロントエンド刷新5年間の実践知
kiichisugihara
1
260
From Formal Specification to Property Based Test
ohbarye
0
2.4k
Featured
See All Featured
Collaborative Software Design: How to facilitate domain modelling decisions
baasie
1
210
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
38
2.9k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
10
1.2k
Marketing Yourself as an Engineer | Alaka | Gurzu
gurzu
0
190
Unlocking the hidden potential of vector embeddings in international SEO
frankvandijk
0
790
svc-hook: hooking system calls on ARM64 by binary rewriting
retrage
2
240
Navigating the moral maze — ethical principles for Al-driven product design
skipperchong
2
350
HTML-Aware ERB: The Path to Reactive Rendering @ RubyCon 2026, Rimini, Italy
marcoroth
1
42
Conquering PDFs: document understanding beyond plain text
inesmontani
PRO
4
2.7k
Automating Front-end Workflow
addyosmani
1370
200k
Measuring Dark Social's Impact On Conversion and Attribution
stephenakadiri
2
190
Data-driven link building: lessons from a $708K investment (BrightonSEO talk)
szymonslowik
1
1k
Transcript
On the evolution and changes of Riotjs@4 We Are JavaScripters!
@30th ʲॳ৺ऀܴLTେձʳ
About me
Basic Information const my_info = { : ‘܂ݪਔ’, : ‘Yumemi
Inc’, : ‘kuwahara_jsri’, : ‘k-kuwahara’, : ‘k-kuwahara’, }
Communities translator staff staff
Sorry... $ Plz feedback for me called “Masakari” about my
English.
Have you ever used riotjs before?
before that …
What is ?
image by: https://riot.js.org/
Characteristics ‣ Custom tags(Component based) ‣ Simple syntax ‣ Human-readable
‣ Small leaning curve
More example
For more details, URL: https://speakerdeck.com/clown0082/re-revolution-to-front-end-with-riot-dot-js
Next @4
There are breaking changes. Let’s pick up some of them.
Change Riot4
Change Riot4 type, src, extension are changes
Change Riot4
Change Riot4 specifying a mount point by “div” is invalid
Change Riot4
Change Riot4 riot.compile() is probably required
Change Riot4 No error message is displayed in “console.log()”
Change Riot4 Specifying “*” results in an error
Change Riot4
Change Riot4 props, state parameters !?
Change Riot4 export default syntax !!
Change Riot4 props, state arguments !!
Display whole code again
Demo Riot4 Code1
Demo Riot4 Code2
Pick up some of the roadmap @4 ‣ “this.tags” ‣
“riot-observable” ‣ “shouldUpdate” method ‣ “:scope” → “:host” ‣ parser/compiler ‣ high performance
Progress Two modules released!! ‣ riot → v4.0.0-beta.2 ‣ dom-bindings
→ v0.11.2 ‣ parser → v0.8.1 Demo: https://codesandbox.io/s/o452941pn6
⚠Caution⚠
It is still in beta, so specifications may change.
Please wait for the official release Riot.js@4!!
Publicity
We’re looking for Engineers!!
None