Skip to main content

What’s new in Svelte: 2022年1月

SvelteKit のビルドの高速化と待望の REPL 機能

Dani Sandoval

Happy new year, Svelte Community! Svelte、SvelteKit、Language Tools、 Showcase にまたがって共有することがたくさんあります。Svelte を使って2021年を素晴らしい年にしてくれた全ての方に感謝します。今年も楽しみにしています 🚀

What’s new in SvelteKit

  • SvelteKit の @sveltejs/adapter-static に precompress オプションが追加され、アセットとページの brotli 圧縮が簡単にできるようになりました (#3079)
  • SvelteKit の Concurrency mode はページを並行してプリレンダリングするようになりました (#3120)。1.0.0-next.205 以降ではデフォルトで有効になります
  • CSS が自動的に JS より前にインクルードされるようになり、ページのパフォーマンスが向上します (d13efe)
  • 新しい設定オプションによって service worker の登録を無効にできるようになり、カスタムで独自の登録を行うことができます (#2988)
  • SSR のルート分割(route-splitting)の導入 - モノリシックなビルドをより小さなピースに分割し、起動とルーティングのパフォーマンスを向上させます (#2931)
  • request.origin/path/query は request.url になりました - 設定とページの load 関数がシンプルになりました (#3126)
  • Vite 2.7 へのアップデート後、SvelteKit ユーザーから 大幅なパフォーマンスの向上が報告されており、SSRでのサードパーティライブラリのロードも大幅に改善されました
  • 設定ファイルの変更時、SvelteKit サーバーが自動的に再起動するようになりました (vite-plugin-svelte#237)

Other new bits from svelte/*

  • Svelte 3.44.3 is out with a few bug fixes in the binding and loop code
  • Svelte Language Tools has introduced support for the then/catch shorthands from Svelte 3.41 and TypeScript’s “go to” functionality (105.8.0 and later)
  • The Svelte REPL got a nice upgrade as well - letting you delete saved REPLs. Try it out by logging in at svelte.dev/apps

Community Showcase

Apps & Sites

  • Discover Twitter Spaces は Twitter Spaces を探すのに便利なツールです
  • Modern Fluid Typography Editor は CSS clamp を使用して美しい fluid typography の作成を手助けしてくれます
  • Unnwhiteboard は “ホワイトボード” 面接を行わない企業(またはチーム)のための job board です
  • Secret Santa は手軽さを重視して開発されたギフトコーディネートアプリです
  • LogSnag は、プロジェクトのイベントを通知し、タイムラインを提供することで、重要なことが起こったときにそれを記録することができます
  • Version 0.2 of Tangent はSvelteベースのノートアプリで、ベータ版になりました
  • Intl Explorer は Intl に対応する全てのフォーマッターの出力を見るためのツールです

A lot of work this month has gone into migrating the Svelte main website and Svelte REPL to live in the https://github.com/sveltejs/sites repository - including a brand new homepage for svelte.dev. Thanks to all the contributors who made this possible!

もし何か作業できる楽しいSvelteKitプロジェクトをお探しなら、Svelte Society サイトの書き直しに貢献できます 💅

Learning and Listening

To Read

To Watch

To Listen To

Libraries, Tools & Components

  • svelte-headlessui は Headless UI コンポーネントライブラリの、アンオフィシャルなSvelte向けの完全移植版です
  • svelte-forms v2 がリリースされました - 作者は フィードバックを募集中です
  • Percival は宣言的なデータクエリと視覚化言語(visualization language)です
  • Svelte FlatList はモバイルフレンドリーで、シンプルで、カスタマイズ可能なドラッグメニューです
  • svelte-keyed はオブジェクトと配列向けの writable derived store です
  • Svemix は Svelte 向けの Remix です - Svelte コンポーネント/ルート内にサーバースクリプトを配置し、それがエンドポイントに変換されます

ショーケースに追加したいものがありますか？Svelte でアイデアを実現するのに助けが必要ですか？ Reddit または Discord にご参加ください！

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