SvelteKitとは一体何なのか？
Svelteアプリの構築方法を再考しています。知っておくべきことは次のとおりです。
先月Svelte Summitに参加された方は、私の講演「未来のWeb開発」をご覧になったかもしれません。そこで私は、Svelteについて最も頻繁に寄せられる質問の一つである「Sapperはいつバージョン1.0に到達するのか？」についに取り組みました。
答え：決して到達しません。
これは少し皮肉めいたものでした。講演で説明したように、実際にはSapperの書き直しとブランド変更のようなものですが、コミュニティから多くの新たな質問が寄せられたので、Sapperの後継であるSvelteKitに何を期待できるのかについてもう少し明確にする必要があります。
Sapperとは？
Sapperは、Svelte（これはコンポーネントフレームワーク）の上に構築されたアプリフレームワーク（または「メタフレームワーク」）です。その役割は、サーバーサイドレンダリング（SSR）やコード分割などの最新のベストプラクティスをすべて備えたSvelteアプリを簡単に構築できるようにし、開発を生産的かつ楽しいものにするプロジェクト構造を提供することです。それは（Nextで普及し、他の多くのフレームワークでも採用されている）ファイルシステムベースのルーティングを使用します。プロジェクトのファイル構造がアプリ自体の構造を反映しています。
Svelteのホームページとドキュメントでは、アプリの構築を開始するためにdegitでsveltejs/templateリポジトリを取得することを推奨していますが、Sapperは長い間、アプリを構築するための推奨方法でした。このブログ記事自体も（執筆時点では！）Sapperでレンダリングされています。
なぜ新しいものに移行するのか？
まず、sveltejs/templateとsveltejs/sapper-templateの区別は、特にSvelteの初心者にとっては混乱を招きます。Svelteでアプリの構築を開始するための単一の推奨方法を持つことには大きなメリットがあります。オンボーディングを簡素化し、メンテナンスとサポートの負担を軽減し、予測可能なプロジェクト構造を持つことで解き放たれる新しい可能性を模索し始めることができる可能性があります。（この最後の部分は、それらの可能性が何であるかを完全に理解するのに時間がかかるため、意図的に曖昧になっています。）
それとは別に、私たちはしばらくの間Sapperの書き直しを考えさせられてきました。これは、コードベースが長年にわたって少し乱雑になっているため（Sapperは2017年に始まりました）、主に、最近Webが大きく変化しており、私たちの基本的な前提を再考する時期だからです。
この新しいものは何が違うのか？
これらの基本的な前提の最初にあるのは、アプリを構築するためにwebpackやRollupのようなモジュールバンドラーを使用する必要があるということです。これらのツールは、アプリケーションの依存関係グラフをトレースし、コードを分析および変換しながら（たとえば、SvelteコンポーネントをJSモジュールに変換するなど）、どこでも実行できるコードのバンドルを作成します。Rollupのオリジナルクリエイターとして、それは驚くほど複雑で、厄介なエッジケースがある問題であると断言できます。
数年前には、ブラウザーがimportキーワードをネイティブにサポートしていなかったため、確かにバンドラーが必要でしたが、今日ではあまり当てはまりません。現在、私たちはバンドルされていない開発ワークフローの台頭を目撃しています。これは根本的に単純です。アプリを事前にバンドルするのではなく、開発サーバーが必要に応じてモジュール（必要に応じてJavaScriptに変換）をオンデマンドで提供できるため、アプリがどれほど大きくなっても起動は本質的に瞬時です。
Snowpackはこの動きの先駆者であり、SvelteKitを動かしているものです。驚くほど高速で、素晴らしい開発体験（ホットモジュールリローディング、エラーオーバーレイなど）があり、SSRのような機能についてSnowpackチームと緊密に協力してきました。ホットモジュールリローディングは、RollupでSapperを使用することに慣れている場合（最も効率的な出力を優先するアーキテクチャのため、これまでファーストクラスのHMRサポートがなかった）は特に啓示的です。
バンドラーを完全に放棄しているわけではありません。本番環境向けにアプリを最適化することは依然として不可欠であり、SvelteKitはRollupを使用してアプリを可能な限り高速かつ効率的にします（これには、スタイルを静的な.cssファイルに抽出するなどの処理が含まれます）。
もう1つの基本的な前提は、サーバーレンダリングされたアプリには、サーバーが必要であるということです。Sapperには、実質的に2つのモードがあります。Nodeサーバーで実行する必要があるスタンドアロンアプリを作成するsapper buildと、GitHub Pagesなどのサービスでのホスティングに適した静的ファイルのコレクションとしてアプリを焼き付けるsapper exportです。
静的ファイルはほぼどこにでも配置できますが、Nodeサーバーを実行する（および監視/スケーリングなどを行う）ことはそれほど簡単ではありません。最近では、アプリの作成者として、コードが実行されているサーバーについて、関連するすべての複雑さを考慮する必要がないサーバーレスプラットフォームへの移行を目撃しています。vercel-sapperのようなもののおかげで、サーバーレスプラットフォームでSapperアプリを実行できますが、これは確かに慣用的とは言えません。
SvelteKitはサーバーレスパラダイムを完全に採用しており、主要なすべてのサーバーレスプロバイダーをサポートして開始し、公式に対応していないプラットフォームをターゲットとするための「アダプター」APIを備えています。さらに、部分的なプリレンダリングを実行できます。これは、静的なページはビルド時に生成できますが、動的なページはオンデマンドでレンダリングされることを意味します。
いつから使い始められるのか？
勇敢な方は、今すぐ始めることができます。
npm init svelte@nextこれにより、新しいプロジェクトがスキャフォールディングされ、アプリの開発とビルド用のツールを提供する@sveltejs/kit CLIがインストールされます。
ただし、お勧めはしません。ドキュメントはなく、いかなる形のサポートも提供することはできません。また、頻繁に壊れる可能性があります。
作業は、まだ探索モードにある間、プライベートモノレポで行われています。私たちの計画は、いくつかの問題を解決したら、パブリックベータ版を準備し、ここで発表することです。その時点ではリポジトリ自体はプライベートのままですが、YOLOな人々からのフィードバックを収集する場所を作成します。その後、リポジトリを公開することを含む1.0リリースに向けて作業します。
約束を破るのが好きではないので、タイミングについて確固たる約束はしません。しかし、数ヶ月ではなく、数週間の話をしていると思います。
SvelteKitを使いたくない場合はどうすればいいですか？
そうする必要はありません。Svelteは常にスタンドアロンパッケージとして、またはrollup-plugin-svelteのようなバンドラー統合を介して使用できます。私たちは、あなたがどれほど難解であっても、Svelteをあなたのワークフローに合わせて調整したり、Elder.js、Routify、Plenti、Crown、JungleJSなどのサードパーティアプリフレームワークを使用したりできることが不可欠であると考えています。
TypeScriptは？
ご心配なく、完全なTypeScriptサポートなしでリリースすることはありません。
既存のSapperアプリを移行するにはどうすればよいですか？
ほとんどの場合、Sapperのコードベースを移行するのは比較的簡単であるはずです。
いくつかの避けられない変更（サーバーレスプラットフォームで実行できるようにするには、カスタムserver.jsファイルと(req, res) => {...}関数をよりポータブルな同等のものに置き換える必要がある）があり、いくつかの設計上の欠陥を修正する機会を利用していますが、全体として、SvelteKitアプリはSapperユーザーにとって非常に馴染みのあるものに感じられるでしょう。
詳細な移行ガイドは、1.0のリリースに付随します。
どのように貢献できますか？
パブリックベータ版をリリースし、リポジトリを公開する時期に関する発表にご注目ください。（また、ブログ記事はTODOですが、プロジェクトがあなたにとって価値があった場合、経済的に貢献できるOpenCollectiveができたことを言及しなければ、私は不注意でしょう。すでに貢献してくださっている多くの方々に心から感謝いたします。）
どこでさらに詳しく知ることができますか？
Twitterで@sveltejsと@SvelteSocietyをフォローし、svelte.dev/chatにアクセスしてください。Svelte Radioも購読する必要があります。そこでは、ケビンと彼の共同ホストが今後のエピソードでこのプロジェクトについて私を厳しく質問します（そして、録音する来週までの間に、このTwitterスレッドに返信して、追加の質問をしてください）。