自作フレームワークをつくって学ぶ 仮想DOM実践入門

昨今の代表的なJavaScriptフレームワーク（React、Vue.jsなど）には「仮想DOM（Virtual DOM）」という概念が採用されているので、フロントエンド界隈の人は一度は耳にしたことがあるだろう。ただ、仮想DOMについて学ぼうと検索してもヒットするのは「フレームワークの使い方」ばかり。踏み込んでいても概念の説明どまりで、仮想DOMがどのように実装されているか解説した記事はすくない。 ということで、当記事では理解を深めるために仮想DOMを使ったフレームワークを自作し、仮想DOMに入門する！ そして、ReactやVue.jsを単なるブラックボックスのフレームワークではなく、中身を理解して使えるようになることを、当記事の目標とする。 フレームワークが完成すると以下のようなWebアプリケーションがつくれるようになる。 TOC 記事が長くなりそうなのでも目次 そもそもDOMとは？ D

[bc_rikko]

仮想DOMのフレームワークの実装方法について書きました！

[programmablekinoko]

素晴らしい / いずれHTMLが標準でエレメントやコンポーネントに値をバインド・高速描画出来るようになって仮想DOMが不要になって欲しい

[soy-curd]

hyperappっぽいなと思ったら参考元だった

[efcl]

Virtual DOMの仕組みについてVirtual DOMを実装しながら学んでいくチュートリアル。 Virtual DOMとして作ったオブジェクトを実際のDOMにどのように反映するか差分の変更検知などの実装。 またHyperAppのようなActionの実行と表示更新

[kikuchi1201]

勉強になる

[tomato3713]

仮想DOMとDOMの変換とか、差分検知の話

[riywo]

超絶わかりやすかった！

[xoyip]

なにこれ楽しそう

[Rockridge]

仮想DOMを使ったフレームワークの実装過程を解説することを通じて、仮想DOMの機能を実践的に学べるようにした記事。

[d4-1977]

なんか凄そう（小並）

[griefworker]

仮想DOMとフレームワークを実装しながら仕組みを学べて素晴らしい。

[snowlong]

vue とかreact とか仮想DOMとか

[dhrname]

大昔、SIEプロジェクトで、仮想DOMじゃなくて、リアルDOMそのものをJavaScriptで実装したことならある。ゲーム実況で、縛りプレイしている人の気持ちがよく分かった

[gonta616]

このへん、再開発できる人ほんとすご

[sakaguchi-ba55-0ne]

仮想DOMをつくる

[karikari1255]

いつからreactがフレームワークになったんだろう。オレオレフレームワークを作るためのただのライブラリのはずだが。

[Dai_Kamijo]

自作フレームワークをつくって学ぶ 仮想DOM実践入門｜Black Everyday Company @bc_rikkoさんから — 上條　大 (@Dai_Kamijo) November 19, 2018 from Twitter https://twitter.com/Dai_Kamijo November 19, 2018 at 11:19AM via IFTTT

[yarumato]

“従来のリアルDOMを操作する実装と、仮想DOMのフレームワークを使った実装を具体的な小アプリで比較”

[mzkzzz]

きになる