Svelte
.svelteにHTML/CSS/JavaScriptを記述する
HTMLっぽい記法ものもここに書くのでテンプレート的な書き方ができる
Svelteでコンパイルして普通のHTML/CSS/JS構成を吐き出す
速い
Reactの35倍、Vueの50倍
状態管理はObservable
記述量が少ない
開発者はRich Harris
仮想DOMを使わない
website
github
tutorial
https://svelte.dev/tutorial/basics
主要なframework
Sapper
SvelteKit
Svelte Native
Svelteでmobileアプリ作る
https://github.com/halfnelson/svelte-native
https://svelte-native.technology/
本
『Svelte and Sapper in Action』
https://www.manning.com/books/svelte-and-sapper-in-action
Manning Publicationsの本
https://dev.to/thepassle/using-typescript-without-compilation-3ko4
内部実装がTSからJSに変わるらしい
思想
https://svelte.dev/blog
https://svelte.dev/blog/write-less-code
https://svelte.dev/blog/virtual-dom-is-pure-overhead
例
code:svelte
<script>
const message = 'Hello!';
let checked = false;
</script>
<main>
<h1>Hello {name}!</h1>
{#if checked}
<div>Checked!</div>
{/if}
</main>
<style>
</style>
#??
syntaxはJS?
sbelete with Reactのような使い方はできる?
特徴的なexample code
どこが良い?
ライブらいは?
コンポーネント指向?
js/html/cssファイルを読み込むこともできる?
仕組みを知りたい
Virtual DOM?
仮想DOMっぽいリアルタイムレンダリングはできるっぽい
向き不向き
たとえば大きなプロダクトではきついとか
Compilerの実装
https://dev.to/joshnuss/svelte-compiler-under-the-hood-4j20
VSCode Extension
https://marketplace.visualstudio.com/items?itemName=JamesBirtles.svelte-vscode
参考
Svelteで始める頑張らないフロントエンド生活 前編
環境構築、概要、小さなサンプル
https://sbfl.net/blog/2020/02/03/svelte-frontend-2/
https://qiita.com/jgs/items/2d985894ea07f48b74fb
https://www.infoq.com/jp/news/2019/07/svelte-3-interview-rich-harris/
https://medium.com/javascript-in-plain-english/is-it-time-to-move-on-from-virtual-dom-reactjs-2c01afbf81fb
https://tech.smartcamp.co.jp/entry/svelte-feature-for-vuejs-engineer
https://zenn.dev/mizchi/scraps/a5644f129032aa
https://uit-inside.linecorp.com/episode/80
https://github.com/sveltejs/svelte/issues/2546
https://uit-inside.linecorp.com/episode/72
https://uit-inside.linecorp.com/episode/80
https://speakerdeck.com/baseballyama/svelte-runtime-101-jsconf-jp-2022
https://yuheiy.hatenablog.com/entry/2020/01/25/230154
Rich Harris