メインコンテンツにスキップ

Svelte の最新情報: 2022 年 7 月

SSR の高速化、言語ツールの改善、そして新たな有償コントリビューター！

Dani Sandoval

SSR の高速化から SvelteKit での Vitest と Storybook のサポートまで、今月のニュースレターには多くの情報が満載です...

早速見ていきましょう！

OpenCollective の資金提供が Svelte を前進させる

Svelte のサポーターは、OpenCollective のプロジェクトに約 80,000 ドルを寄付しました。私たちは、この資金が Svelte を有意義な形で前進させるために活用されていることを喜んでお知らせします。@gtm-nayan は、SvelteKit を 1.0 レベルの安定性にするために、このプロジェクトへの有償コントリビューターとして、先月から SvelteKit の問題のトリアージと修正を開始しました！ @gtm-nayan は、長い間 Svelte コミュニティの活発なメンバーであり、Discord サーバーの運営を支援するボットの作成者としてよく知られています。この資金提供により、Svelte が彼の時間をより多く確保できるようになったことを嬉しく思います。

また、OpenCollective の資金を活用して、Svelte のコアメンテナーが今秋にSvelte Summitに直接参加できるようにする予定です。これまでに寄付してくださった皆様、ありがとうございます！

Svelte と言語ツールの最新情報

  • チュートリアルは、現在開発中の、Svelte と SvelteKit を基礎から学ぶための新しい方法です。
  • 次の Svelte リリースでは、SSR が高速化されます。2 年にわたる PR の結果、一部のベンチマークテストでは最大 3 倍のレンダリング速度が実現しました！（PR）
  • Svelte 拡張機能の最新バージョンでは、「ファイル参照の検索」（0.14.28）と「コンポーネント参照の検索」（0.14.29）により、Svelte ファイルとコンポーネントがインポートおよび使用されている場所が表示されます（デモ）
  • Svelte 拡張機能は、CSS パス補完をサポートするようになりました（0.14.29）

SvelteKit の最新情報

  • SvelteKit が Vitest や Storybook などの Vite エコシステムの他のツールと相互運用できるようにする @sveltejs/kit/experimental/vite を導入しました（#5094）。実験段階から外して、すべてのユーザーに `vite.config.js` を必須にすることを検討しているので、この機能が動作するかどうか、役に立つかどうかについてフィードバックをお寄せください
  • エンドポイントでのストリーミングがサポートされるようになりました（#3419）。これは、Undici の `fetch` 実装に切り替えることで実現しました（#5117）
  • 静的アセットは、開発環境でシンボリックリンクできるようになりました（#5089）
  • `browser` と `dev` に対応して、`server` と `prod` 環境変数が利用できるようになりました（#5251）

コミュニティショーケース

Svelte で構築されたアプリとサイト

  • Virtual Makerを使用すると、ブラウザでインタラクティブな 3D および VR シーンを作成できます
  • Apple Beta Musicは、Svelte と Web コンポーネントの組み合わせで記述されているようです
  • ブラジル最大のラジオ局であるItatiaiaが、ニュースポータルを SvelteKit でリニューアルしました
  • Pronaunsは、IPA を使用してオンラインで発音を学び、よりネイティブに近い発音で話すことができるように支援します
  • Immichは、モバイルフォンのビデオや写真のためのオープンソースの高性能セルフホスト型バックアップソリューションです
  • Pendekは、SvelteKit、Prisma、PlanetScale を使用して構築されたリンク短縮サービスです
  • Grunfyは、最近 SvelteKit に移行されたギターツールセットです
  • Radiant: The Future of Radioは、Svelte と Capacitor を使用して構築されたパーソナルラジオ局アプリです
  • Imperfect Remindersは、それほど時間に依存しないタスクのための ToDo リストです
  • Periodic Tableは、Svelte で記述された動的な周期表コンポーネントです
  • Svelvetは、インタラクティブなノードベースの図を作成するための軽量な Svelte コンポーネントライブラリです
  • publintは、環境間の互換性を確保するためのパッケージエラーの lint です
  • Playlistrは、Spotify プレイリストの管理と作成を支援します
  • Geoff Rich のページ遷移デモは、SvelteKit の `beforeNavigate` / `afterNavigate` フックを使用して、最新の Chrome Canary でスムーズなドキュメント遷移を実現する方法を示しています
  • Menger Spongeは、Threlte を使用して構築されたフラクタルです

最新の SvelteKit 機能を使用したサイトに貢献したいですか？Svelte Society サイトの構築にご協力ください！

学習リソース

Svelte チーム主演

視聴するには

読むには

ライブラリ、ツール、コンポーネント

  • Svend3rは、Svelte 用のプラグアンドプレイ D3 チャートライブラリです
  • Svelte Hover Draw SVGは、ホバー時に SVG を描画するための軽量な Svelte コンポーネントです
  • Svelte French Toastは、デフォルトで軽量でカスタマイズ可能、そして美しい、バターのように滑らかなトースト通知を提供します
  • SVooltipは、Floating UI を搭載した基本的な Svelte ツールチップディレクティブです
  • Svelte Brick Galleryは、Svelte 用の masonry のような画像ギャラリーコンポーネントです
  • use-vestは、Vest のための Svelte アクションです。Vest は、フォームの検証とエラーの表示を容易にするライブラリです
  • Svelidateは、依存関係のない、シンプルで軽量な Svelte 用フォームバリデーションライブラリです
  • Svve11は、「アクセシビリティファースト」の Svelte 用コンポーネントライブラリです
  • Slidyは、テンプレートといくつかの便利なプラグインを備えた、シンプルで設定可能、再利用可能なカルーセルスライドアクションスクリプトです
  • Svelte Component Snippetsは、一般的な Svelte スニペットにアクセスできる VS Code 拡張機能です
  • Svelte Confettiは、紙吹雪でアプリにちょっとした彩りを添えます 🎊

見逃したものはありますか？RedditまたはDiscordでお知らせください。

ストックホルムで開催される Svelte Summit にも直接参加できることをお忘れなく！素晴らしい Svelte コンテンツが 2 日間にわたって提供されます！今すぐチケットを入手してください。

来月またお会いしましょう！