靜態網站生成器將會成為下一個大熱門
Matt Biilmann 是現代靜態網站托管服務Netlify的聯合創始人兼CTO,在開發工具構建、內容管理系統和Web基礎架構方面有10多年的經驗。他從開源目錄 StaticGen 及GitHub上發現,靜態網站生成器發展迅速。像 Nest 和 MailChimp 這樣專注于設計的公司現在就使用靜態網站生成器構建他們的主要站點。 Vox Media 基于 Middleman 構建了一個 完整的發布系統 。 Carrot 使用自己的開源生成器 Roots 為一些世界上最知名的品牌創建網站。近日,Matt 撰文 分析了這一現象背后的原因,并預言靜態網站生成器將成為下一個大熱門。
像Dreamweaver和FrontPage這樣的桌面應用程序,通過WYSIWYG編輯器為構建以內容為驅動的網站提供了解決方案。網頁被分成了導航欄、標題欄、頁腳欄等可重用的部分。在某種程度上,這就是最早的靜態網站生成器。但隨著發展,這樣的工具逐漸無法滿足現代網站構建中設計與內容相分離的要求。于是,LAMP技術棧及諸如 WordPress 、 Drupal 和 Joomla 這樣的CMS成為主流,Web進入2.0時代。用戶不再只是跟隨超鏈接瀏覽內容,而是可以訂購產品、參與社區及創建內容。
但是,動態網站容易遭受蠕蟲攻擊。據保守估計,超過70%的WordPress部署容易因為已知漏洞遭受攻擊(超過23%的Web網站以WordPress為基礎構建)。而幾個月前, 1200萬個Drupal站點需要緊急打補丁 。此外,即使是最為優化的動態網站,其性能也無法同靜態網站相比。并且,對于動態網站而言,緩存失效非常難以恢復,尤其是需要充分利用CDN的分布式緩存。WordPress網站并不保證同一個URL不會返回不同的HTML。跟蹤頁面緩存是否失效非常復雜。在這一點上,靜態網站完全不同。它們遵循一個非常簡單的緩存約定:在URL所對應的文件沒有更新的情況下,任何URL都會返回相同的HTML。
近年來,作為傳統動態網站基礎架構的替代方案,現代靜態網站生成器日漸盛行。許多導致靜態網站失敗的限制已不復存在。現在,每周都會有新的靜態網站生成器發布。通常,它們都有如下特點:
- 模板 :允許將網站分解成布局組件和包含組件,以便消除重復,這是靜態網站生成器的基本要素之一。
- 支持Markdown :Markdown的興起是靜態網站生成器流行的根本原因之一。所有主要的靜態生成器都支持Markdown,也有一些支持 reStruturedText 或其它標記格式。但通常,它們都允許內容開發人員以結構化的格式編寫純文本文檔,保證了內容與設計的分離。
- 元數據
:在文檔頂部,通常采用YAML格式,如下所示:
標題:文檔標題
分類:類A 類B
---
# 具體內容
文檔正文
這使得使用元數據為單個文檔作注解非常簡單。
- 資源管道 :現在的前端開發幾乎總是用到多種構建工具和編譯器。大多數現代靜態網站生成器都包含了一個資源管道,用于處理資源編譯、轉譯、壓縮和打包。
另外,靜態網站生成器通常會提供一個命令行UI,用于構建網站或運行本地服務器。例如, Jekyll 就提供了jekyll build命令。
Matt認為,靜態網站生成器技術現在之所以崛起,主要是因為如下幾個原因:
- 瀏覽器發展 :現代瀏覽器本身就是一個操作系統。它不再只是顯示從Web上下載的文檔,而是能夠運行成熟的Web應用程序,過去許多需要動態代碼的特性現在都可以移到客戶端了。例如,可以使用 Disqus 、 Isso 添加評論功能,使用推ter或非死book的JavaScript組件集成社交應用,使用 Swiftype 添加搜索功能,等等。基于瀏覽器的網站插件越來越多,而使用Ember.js、AngularJS或React構建的現代Web應用通常也完全作為靜態網站部署。
- CDN成為主流 :任何人都可以注冊Amazon AWS,并在網站前端設置 CloudFront 服務。 Fastly 、 MaxCDN 、 CloudFlare 等公司提供了小企業也用得起的CDN服務。雖然動態網站也能使用CDN,但緩存失效是個棘手的問題,而靜態網站很容易直接部署到CDN,并可以直接從離用戶近的本地緩存提供服務。
- 高性能不可或缺 :越來越多的用戶通過移動設備訪問網站,網站性能變得前所未有的重要。移動設備不支持多任務,瀏覽網頁時幾乎無法做其它事,等待頁面加載會格外讓人沮喪。然而,動態網站無論如何優化,其性能也永遠不如一個托管在CDN上的靜態網站有保障。此外,靜態網站生成減少了許多開發過程中需要考慮的性能問題,例如,無需考慮數據庫查詢的效率。
- 構建工具應用廣泛 :前端開發人員大量地使用構建工具、包管理器和各種編譯器、轉譯器。Grunt是第一個成為主流的前端構建工具,大多數新項目都有構建步驟。構建工具的普及使得靜態網站生成器更自然地成為前端工具集的一部分。
但是,在成為主流之前,靜態網站生成器還有一些工作要做。例如,初次選擇一個靜態網站生成器并開始一個項目非常困難,因為這涉及許多復雜的細節,而且這些工具及其文檔都還有很大的改進空間。另外,靜態網站生成器距離成熟的主流市場還很遠,無法提供同傳統動態網站平臺一樣的服務,最為明顯的就是 內容編輯 。對前端開發人員而言,在文本編譯器中直接使用Markdown進行編輯并發送到GitHub是個理想的工作流程,但對非技術出身的終端用戶而言,這種方式并不友好。這是內容編輯同靜態網站生成之間存在的一個巨大鴻溝。該問題不解決,靜態網站生成就不會成為主流。
所幸,目前已經有一些“非CMS”方案。例如,The Verge就一直 使用Google Sheets作為Middleman的內容層 ; StaticGen 將Gist和GitHub API當作數據庫用;Carrot 使用Contentful作為一個靜態CMS 。Matt還提到了其它一些內容編輯解決方案,如 Prose.io 、N etlify的開源CMS ,感興趣的讀者可以進一步研究。