跳至主要內容

Svelte 最新消息：2022 年 7 月

更快的 SSR、語言工具改進以及新的付費貢獻者！

Dani Sandoval

從更快的 SSR 到 SvelteKit 中對 Vitest 和 Storybook 的支援，本月的新聞報導有很多內容需要涵蓋...

那我們就深入探討吧！

OpenCollective 資金推動 Svelte 前進

Svelte 的支持者已在 OpenCollective 上為該專案捐贈了約 80,000 美元。我們很高興分享這些資金正被用於以有意義的方式推動 Svelte 前進。@gtm-nayan 在過去一個月已開始整理並修復 SvelteKit 的問題，作為該專案的付費貢獻者，以幫助我們將 SvelteKit 提升到 1.0 的穩定程度！@gtm-nayan 一直是 Svelte 社群的活躍成員，並以編寫幫助我們的 Discord 伺服器運作的機器人而聞名。我們很高興這筆資金讓 Svelte 能夠獲得他更多的時間。

我們也將利用 OpenCollective 的資金，讓 Svelte 核心維護者能夠親自參加今年秋天的 Svelte Summit。感謝迄今為止捐款的每個人！

Svelte 與語言工具的新功能

  • 教學是一種從頭開始學習 Svelte 和 SvelteKit 的新方法，目前正在開發中
  • 更快的 SSR 將在下一個 Svelte 版本中推出。這是歷時兩年的 PR，在一些基準測試中導致渲染速度提高高達 3 倍！（PR）
  • 最新版本的 Svelte 擴充功能中的「尋找檔案參考」（0.14.28）和「尋找元件參考」（0.14.29）會顯示 Svelte 檔案和元件的導入和使用位置 (Demo)
  • Svelte 擴充功能現在支援 CSS 路徑完成功能 (0.14.29)

SvelteKit 的新功能

  • 引入了 @sveltejs/kit/experimental/vite，讓 SvelteKit 可以與 Vite 生態系統中的其他工具（如 Vitest 和 Storybook）互通 (#5094)。請留下回饋，說明該功能是否有效且有幫助，以便我們考慮將其從實驗性功能中移除，並讓所有使用者都需要 vite.config.js
  • 現在支援在端點中串流 (#3419)。這是透過切換到 Undici fetch 實作來啟用的 (#5117)
  • 現在可以在開發環境中符號連結靜態資源 (#5089)
  • 現在可以使用 server 和 prod 環境變數作為 browser 和 dev 的推論 (#5251)

社群展示

使用 Svelte 建構的應用程式和網站

  • Virtual Maker 可讓您在瀏覽器中製作互動式 3D 和 VR 場景
  • Apple Beta Music 看起來是使用 Svelte 和網頁元件的某種組合編寫的
  • Itatiaia，巴西最大的廣播電台剛剛在 SvelteKit 中重新啟動其新聞入口網站
  • Pronauns 可協助您線上學習 IPA 發音，以更流利地說話並聽起來更像母語人士
  • Immich 是一個開源、高效能的自託管備份解決方案，適用於您手機上的影片和照片
  • Pendek 是一個使用 SvelteKit、Prisma 和 PlanetScale 建構的連結縮短器
  • Grunfy 是一組吉他工具 - 最近已移轉至 SvelteKit
  • Radiant：未來的廣播是一個使用 Svelte 和 Capacitor 建構的個人廣播電台應用程式
  • Imperfect Reminders 是一個適用於僅在某種程度上具有時間敏感性的事項的待辦事項清單
  • Periodic Table 是一個用 Svelte 編寫的動態週期表元件
  • Svelvet 是一個輕量級的 Svelte 元件庫，用於建構互動式基於節點的圖表
  • publint 會檢查封裝錯誤，以確保跨環境的相容性
  • Playlistr 可協助管理和建立 Spotify 播放清單
  • Geoff Rich 的頁面轉換示範展示了 SvelteKit 的 beforeNavigate / afterNavigate 掛鉤如何在最新的 Chrome Canary 中實現流暢的文件轉換
  • Menger Sponge 是使用 Threlte 建構的分形

想貢獻使用最新 SvelteKit 功能的網站嗎？協助建構 Svelte Society 網站！

學習資源

Svelte 團隊主演

觀看

閱讀

程式庫、工具和元件

  • Svend3r 是一個適用於 Svelte 的隨插即用 D3 圖表程式庫
  • Svelte Hover Draw SVG 是一個輕量級的 Svelte 元件，可在懸停時繪製 SVG
  • Svelte French Toast 提供輕巧、可自訂且預設美觀的滑順吐司通知
  • SVooltip 是一個基本的 Svelte 工具提示指示，由 Floating UI 提供支援
  • Svelte Brick Gallery 是一個適用於 Svelte 的類磚砌圖像庫元件
  • use-vest 是 Vest 的 Svelte 動作，Vest 是一個讓您輕鬆驗證表單並在必要時顯示錯誤的程式庫
  • Svelidate 是一個簡單且輕量級的 Svelte 表單驗證程式庫，沒有相依性
  • Svve11 是一個適用於 Svelte 的「以協助工具優先」的元件庫
  • Slidy 是一個簡單、可配置且可重複使用的輪播滑動動作腳本，其中包含範本和一些有用的外掛程式
  • Svelte 元件程式碼片段是一個 VS Code 擴充功能，可以存取常見的 Svelte 程式碼片段
  • Svelte Confetti 會用一些五彩紙屑來為您的應用程式增添一些風味 🎊

我們遺漏了什麼嗎？請在 Reddit 或 Discord 上告訴我們，以發表您的意見。

別忘了，您也可以親自參加在斯德哥爾摩舉行的 Svelte Summit！快來加入我們，享受兩天的絕佳 Svelte 內容！立即購買您的門票。

下個月見！