Svelte Society Day 2020: Rich Harris: Frequently Asked Questions
わかりみしかなかった。
リッチ氏、本職はNYTのデザイナーなんですよね・・エンジニアじゃないんですよね・・まじすげーわ・・。
Svelte Society Day 2020
- はじめましてRichです
- SvelteのAuthorです
- Svelte Societyというコミュニティをやってます
- 定期的にミートアップやってるよ
- これが初リモート開催で、願わくば最後のリモート開催になりますように
- 今日はFAQに答えていきます
What is Svelte?
- UIを作るためのフレームワーク
- ReactとかVueとかと一緒
- ただ大きな違いは、ランタイムではなくコンパイル時に多くの仕事をするところ
- Write less codeの哲学がある
- 一般的に、ランタイムが小さくなるのが特徴
- なので非力な端末でも軽快に動く
- このあたりを詳細に知りたい場合は、過去に話したものを見てね
- https://www.youtube.com/watch?v=AdNJ3fydeao
- (そういや髪型変えたんだよね)
How can I learn Svlete?
- 公式のチュートリアルがおすすめ
- 動画がいいなら、EggheadとかUdemyとかにもあるよ
- 本もあるよ
- Svelte and Sapper in Action
- まあ自分のプロジェクトで手を動かすのが一番良いけど
Is svelte.dev down?
- そんなこともあったが今は大丈夫
- 昔サイトが落ちてたらしい-
How can I get my editor to understand `.svelte` files?
Is there an UI component library for Svelte?
- UIコンポーネント集ないの?
- あるよ
- 個人的には、自作するのが好きなので使わないけど
- パスタソースも買わないし
Will there ever be an official router?
- すごいよく聞かれる
- さっきのコード集でも検索すると出てくる
- この時点で19くらいある
- Vueは公式のを持ってるのは知ってる
- それで安心する層が一定いるのもわかる
- けど、ルーティングって思ってる以上に複雑で、今のところ公式解は出せない
- 期待せずに待ってて
TypeScript?
- TSはいいよね
- SvelteのコアもコードはTSで書いてる
- 型があると、コード補完も効くしいいよね
- SvelteのASTからJSXを出力して、それで型チェックしたりできるように
- 今まさに着手中で、数ヶ月以内にいいニュースを知らせるつもり
Does Svelte scale?
- この質問されるのは割と嬉しい
- なぜなら、Svelteの仕組みおよびトレードオフを理解しようとしているから
- この問に対しては、基本的にはYesと答えてる
- どのフレームワークもそうだと思うけど
- イメージとして、X軸にコンポーネント数、Y軸にバンドルサイズを取るグラフを想像してみて
- Svelteは`y = x + 20`くらい
- 他のフレームワークは、`y = 0.5x + 60`くらい
- というわけで、どこかの時点でSvelteのほうがサイズが大きくなるポイントはあるはず
- どれくらいかを説明するのは難しい
- 問題はどれくらいのJavaScriptを書くことになるか次第
- ともあれ、他のフレームワークよりも最初に読み込む必要があるランタイムのサイズは小さくなると思う
- 必要あればLazyにロードするなどするとよい
- もちろんリンク先をプリロードしておくこともできる
- そもそもTreeShakingなどのテクニックも活用してこ
- Svelteはコンパイラなので、将来的に問題が起きてもいろんな手が打てるはず
- JSXを出力するとか、Emberみたくバイトコードを出力するとか
- そういうわけで、今の時点でそういう問題は起こってない
- なので、この質問の答えはYes
What is the recommended way to test components?
How do you structure larger projects in Svelte?
- SvelteはただのUIライブラリ
- 大きなプロジェクトでは、もっといろいろ扱うものがあるよね
- なのでSapperを作った
- SSRやCodeSplittingやRoutingやいろいろなことをやってくれる
- Sapperについてもよく聞かれることがあるのでその話をする
What's on the roadmap for Sapper?
Is Sapper dead?
- 死んではないよ
- けど、いい状態でもないと自覚してる
- それは申し訳ない
- 今年は少しOSSから離れていて、戻ろうかなと思った頃にコロナがきた
- なので時間がなくて、権限を移譲していってるところ
- Sapper自体の筋は悪くないと思ってるし、個人的にも使ってる
- Svelte3から多くを学び、取り入れてる
- もしそんなSapperを待ちきれないなら、Routifyとかもあるよ
How do you do server-side rendering with Svelte?
- Sapperがやってるのを参考にしてもいい
- ちょっとデモをする
- `require("svelte/compiler")`する
- そして`compile(source, { generate: "ssr" })`とすればいい
- 同じようなことは、NYTのサイトでもやってる
- 従来のやり方なら、Ajaxでデータを取ってきて、クライアント側で描画するはず
- でもこのサイトでは、事前にビルドしてあるのでそのためのJavaScriptは実行しない
- グラフのところはSVG
- ちなみにコードはなんとGoogleDocsで管理してて、ArchieMLで書いてる
- ほかにはSSRして、クライアント側で`hydrate`してる例もある
What is the goal of Svelte?
Can I give you money?
Where else are we trapped in local maxima?
- 「VirtualDOMに代わる何かが必要だと感じたから、時間と労力をかけてSvelteを作ったとお見受けする」
- 「その他にもここ最近で、局所的最大値に囚われていると考えてるものはある?」というツイートに対して
- あると思う
- Webそれ自体がそうだと思ってる
- 元々はテキストを公開するプラットフォームだったはず
- 最初から今日みたいな使われ方するとわかってたら、もっと違う形になっていたはず
- あとはUIデザインも
- テレビや映画のインタラクションデザイナーと仕事をすると特に感じる
- ソフトウェア開発もそう
- なぜCLIやエディタに向かってテキストを打ち込んでいるんだろうと思うことがある
- これも惰性かなと思ってる
- こういう見方をすると、社会に対しても見え方が変わってくるはず
- 資本主義についてもそう思う
- ずっと話せちゃうので最後に一言だけ
- 今の自分が局所的最大値にいるとして、より高いところに行きたいなら、一度下がってそこから駆け上がるしかない
Is Svelte ready for prime time?
- 「「あーSvelteね、でもプロダクションで使われてないでしょ?」って言われるのなんとかして」というツイートに対して
- 気持ちはわかる
- 個人的になんやかんや言えるけど、そうすべきではないと思うし、コアチームとしても同じ
- それをなんとかできるのは、その境遇にあるあなただけ