svelte触ってみた

Svelte触ってみた

ある日の投稿

なんでSvelte触ったんだっけ？

2019年からずっと満足度高い

概要っぽい話 ・First release 2016 ・v2: The magical disappearing framework 2018 ・v3: Cybernetically enhanced web apps 2019 ・TypeScript Support 2020 ・SvelteKit beta / Japanese Document 2021 ・SvelteKit 1.0 2022 Rich Harries(@Rich_Harris)

触ってみた感想

とにかく速い

なぜこんなに速いのか

No virtual DOM

総当たりで変更点を見つけるのではなく、 コードから変更されうるものを見つけて挙動を変えている

No virtual DOM 仮想DOMは速いという神話を 完全に終わりにしよう （思想強め）

Library Size

内部で何をやってるか見てみる

Svelte compiler ・Javascript + HTMT + CSS → plain Javascript + scoped CSS ・No virtual DOM

Parse後の戻り値をとりあえず見る

No virtual DOM ・コンパイル時にcreate_fragmentという要素が作成され、その中に DOM情報が書き込まれる ・scriptタグ内の全ての変数について、リアクティブに変更される部 分とされない部分を判断してコンパイル時に分けるようにしている ・変わりうるのであれば、それを$$invalidateとctxで繋げられるよう にしている https://svelte.dev/tutorial/basics

• https://svelte.dev/tutorial/basics

個人的に思ったこと ・HTMLライクに書けるので非エンジニアでもコーディングできそう ・画期的だけどまだまだ実績の少ない言語 ・LP、リッチなWebサイト、小〜中規模くらいまでのサービス・プロ ジェクトなら使いやすそう ・コミュニティあったり盛り上がってはいるので今後も追っていく