構建更好Web客戶端的純JavaScript前端：Skit

幾乎能夠100%共享服務器和客戶端代碼，零配置，自動靜態資源綁定和內置服務器端渲染。

Skit是什么？

Skit是一個JavaScript框架，通過下面這個生命周期控制器來創建Web頁面：

執行如下：

自動，無需配置。

skit是由什么組成的？

• 一個網絡服務，用于在服務器上運行你的控制器，并在瀏覽器中通過same-ish狀態自動設置它們；
• 一個模塊系統，用于構建由模版、樣式表和JavaScript共同組成的組件；
• 一組輕量級庫，便于發出HTTP請求、管理cookies和處理服務器和客戶端上的導航。

skit是為了什么？

Skit有利于在現有HTTP基礎的API上構建Web應用，該應用類似于你可能已經為移動應用構建的那種。

Skit不是一個完整的框架，甚至不是一個典型意義上的“Node.js框架”。它更像一個能運行于服務器上的客戶端框架。

Skit的特點

• 共享客戶/服務端代碼
• 零配置
• 最佳模塊
• SEO Natural Way?

Skit是如何工作的？

FAQ

我可以與一起使用它嗎？

也許。如果你現有客戶端框架是取決于DOM操縱來呈現的話，它將無法幫助你太多。這里有一個將React成功集成到項目的例子。

……

Taylor Hughes的Skit之旅

【編者按】Taylor Hughes是LaunchKit的創建者之一，同時還創建過Cluster。本文講訴了其與 Skit的故事，而題目也并不是真的在表達其寫了一個JavaScript框架，而是一旦著手開始，就發現自己“愛上”了它。以下為譯文：

背景

我大約與一年前開始著手這件事，那會我必須考慮所有的事情（這也讓我開始對Web開發抓狂），并在瞬間列舉了需要解決的問題。

起初我在想，也許有一天這件瘋狂的事情將會很酷炫，而那時我會坐收其成。而現在我只需將其變得更現實就好了。

一年后，我每天都會去使用它，用它來建立每一個新的項目，并繼續的完善它。通常壞主意變成現實時會變得很糟糕，但是它成為現實時卻沒有，這是不是意味著它一開始就不是個壞主意呢？

請聽我詳細的講述這件事，或許你也會心動。

一切由此開始

在2014年中旬，我工作于Cluster Web應用的第一個版本。logged-in web應用是由RequireJS、Mustache、jQuery和Django構建。它是個單一頁面應用，而我則有一些加載所有客戶端JavaScript模塊的RequireJS配置。

這個應用做了大量Web應用應該做的事情：

• 服務最佳化、版本化JavaScript和CSS軟件集（來自Cloudfront的產品）
• 針對非死book、推ter和Google，我在頁面中呈現各種類型的真實元數據。
• 我在服務器上預渲染一些“一屏顯示”的內容，其余部分則放在了客戶端。所以用戶在頁面加載時不會看到一個完全空白的頁面。
• 我將服務器上加載下來的數據傳遞到客戶端以作為JSON，這樣后續的客戶端渲染會立即生效。
• ……

我試圖讓所有事都正確的進行著，并且我也做到了。擁有許多小技巧和非凡配置集的Rube Goldberg machine是可以工作的。

隨著時間的推移，我注意到了一些不好的事情發生了：

最終Web頁面變得復雜和笨重，而這是我一開始所極力避免的。

前端變得如此復雜，一切都太容易讓人動怒。人們開始向我投訴，所以發生了什么？

配置變得勢不可擋，部分服務和客戶端渲染成巨大的上下文切換，將所有事物都包含在內。我想我還能做一些讓構建Web前端變得簡單和有趣的事情嗎？

“不討厭”的前端Web開發是什么樣的？

這是我所能想到的樣子：

• 零配置
• 自動包含相關樣式
• 自動資源編輯
• 服務端引導

它始終是同構的

解決這種東西需要一系列服務端工作，所以這不在僅僅是客戶端JavaScript框架的范疇了。

舉個例子來說，它需要知道產品是如何綁定和優化客戶端文件并在開發模式中如何各自的包含個體的、不可緩存的JavaScript文件集。同時還要以類似的方式處理CSS和軟件集，并自動的包括那些對應于我們加載的JavaScript模塊。

此外，如果我們想要擺脫配置來引導頁面，則需要放棄控制服務端完全呈現。這樣的框架最終會是一個整體類，而不是一個“可插拔的庫”——沒有配置，它需要大量的結構和協定。

最終呈現的是一個 client-side framework，然后就是一個處理HTTP請求的server-side runtime，之后讓所有東西都可以運行于一個瀏覽器里的。

Hello world

Skit，一個充當純API客戶端構建網站的客戶/服務端JavaScript框架，

一個Skit應用的代碼庫是一個單一的代碼庫，共享相同需求的JavaScript模塊、模版等（從服務端到客戶端）。代碼通過Node.js中的Skit運行時被執行，隨后在瀏覽器中顯示出來。

Skit的工作方式是通過抽象化頁面生命周期來跨過頁面加載障礙。你為一個頁面編寫單一的控制來操縱加載服務器上的數據，在HTML中呈現數據并與一個瀏覽器中的DOM掛鉤，而所有的這些都在同一個文件里。

數據加載和渲染步驟最初發生于服務器端，然后控制器以same-ish狀態自動具體化于客戶端。這聽上去有點不可思議，不過實際上它是不錯的。

Skit中每一個URL路徑都對應于一個單一的skit控制器子類和一個控制器。參考下圖：

項目主頁：http://www.baiduhome.net/lib/view/home/1428582425588

來自：http://geek.csdn.net/news/detail/30317