Linux中國

Hugo 對比 Jekyll :兩大領先的靜態頁面生成器之間的比較

除非你是像艾米莉·狄金森那樣深居簡出的人,否則,當做了點事情後,你就會想要與這個世界分享分享你的作品意味著需要一個網站。當然,你可以只是享受數字時代的便利,使用任何不同的社交網站來將你的作品呈現在觀眾面前。還有很多選擇,不僅僅是傳統的社交網站,例如 Artstation、Flickr、Soundcloud、Wattpad,不管你的媒介是什麼,總有一款屬於你的網站。

實際上,你應該使用這些網站,畢竟,人們都在這些網站上。然而,沒有一個地方是真正屬於你的。沒有一個網站是你能保證不管社交趨勢如何,人們都能在該網站上找到你的作品的。

控制權,這是擁有一個在網上屬於自己的地方的意義。

但是這篇文章不打算介紹註冊域名和託管你的網站。要介紹的是後續的步驟,真正地製作網頁。對於很多人來說,典型的選擇是使用像 WordPress 那一類的軟體。在大多數主機託管商上,只需一次點擊即可安裝,然後就會有海量的插件和主題可供選擇。插件和主題的選擇取決於你想要製作的網頁的類型。但是 WordPress 不僅對於大部分網站來說有點過猶不及,還給了你一個有許多活動部件的動態頁面。如果你沒有保持這些部件最新,這些部件可能造成重大安全隱患,你的頁面因此被劫持。

替代方法是擁有一個靜態網頁,在服務端沒有任何動態內容生成。只有一些原先的 HTML 和 CSS (或許還有點 Javascript 也挺好)。這種選擇的不好的一面是以後你要親自動手編寫所有的代碼。雖然可行,但你只是想要個地方來展示你的作品而已,你並不想知道底層網頁設計的特性(和重要的但卻令人頭疼的跨瀏覽器兼容性)。

使用靜態頁面生成器。你得到了靜態 HTML 頁面的速度與安全,但是是以有著接近於動態頁面的便利性的工作流程完成的。在靜態頁面生成器世界的兩大先驅是 HugoJekyll ,(順道說下,Paolo Bonzini 的文章 《Jekyll 起步》 寫得不錯)但是哪一個才是你的正確選擇?希望閱讀完這篇文章,你會更加了解。我們將基於易上手性、主題可用性、編輯方式和拓展性這幾點評估這兩個靜態頁面生成器。

開始

公平地提醒一下,這兩個都需要你在命令行下使用他們。大部分命令都很直接和易於記憶,但是讓我們相應地調整下我們的期望吧,這不是點擊幾下滑鼠就能做事的界面。

JekyllHugo 的安裝都相當的簡單。 Jekyll 以 RubyGem 的方式安裝,Hugo 提供了一個方便的集成的二進位文件讓你迅速上手。因為安裝包單一,Hugo 以微弱優勢領先。雖然 Jekyll 的 RubyGems 安裝方式本身就很簡單,但是它確實需要你已經在你的電腦上正確安裝並且配置好 Ruby 環境。除了社區設計者和網頁開發者,大部分的使用者並沒有提前安裝好。

雖說是這樣,但是一旦安裝好,Hugo 和 Jekyll 都很好用。它們都有良好的文檔和快速開始指南。你用一個簡單命令新建一個頁面(在 Jekyll 里是 jekyll new <your_site> ,在 Hugo 里是 hugo new site <your_site>,譯者註:<your_site> 指代你網頁的名稱)。這一步新建了一個通用目錄結構和你網站的大致內容。目錄結構和基本的配置都十分相似。Jekyll 使用一個 _config.yml 文件,Hugo 使用 config.toml(雖然你在 Hugo 的配置里使用 YMAL 或者 JSON 語法,如果覺得其中一個使用起來更舒服的話)。每個內容文件的 前置配置 front matter 元數據使用相同的配置語法。然後,所有的內容都是用 Markdown 寫的。

我想說就幫助你開始第一個靜態網頁這一點來說,Jekyll 稍微領先於 Hugo ,因為它能以一些基本的內容和一個默認主題開始著手使用。當在建設網頁時,你能使用這些內容作為一個樣板。Hugo 沒有樣例內容,甚至沒有一個默認主題。即便如此,樣例內容和默認主題是我在用任何工具建設網站時第一個刪除的內容,因此 Hugo 事實上幫我節省了這一步。

主題

正如我所提到的,Hugo 根本沒有默認主題,所以主題可能是你打算最先設置的。Jekyll 有一個得體的默認主題,雖然它只是個骨架。你或許也會想去為你的 Jekyll 頁面找一個主題。

Hugo 和 Jekyll 都有多種多樣的各類主題,網頁樣式從單頁面的主題到帶有博客和評論的完善的多頁面主題都有,一應俱全。儘管如此,想找到滿足你需求的主題事實上並不簡單。無論使用哪個,主題網站——Hugo 的 themes.gohugo.io 和 Jekyll 的 jekyllthemes.org ,基本上都是一個充滿主題截圖的巨大頁面。一旦你點擊主題,你能得到關於該主題的一些十分詳細的信息,但是對於初步搜索相當困難。Hugo 的主題站有一些基本的標籤分類,但是大體上在我看來,主題搜索和展示都是這兩個項目需要繼續努力的。

主題管理也是一個有趣的主題。在兩個項目中,幾乎每一個主題都是一個 Git 倉庫(經常是託管在 Github 上),你需要 克隆 clone 下來到你的網頁建設地。在 Jekyll 里,有額外的使用 RubyGems 的 bundle 的步驟來確保主題是由網站管理的。大部分主題都有一個 Gemfile,使得這一步驟輕鬆不少。如果主題沒有一個 Gemfile,添加也相當簡單。在 Hugo 里沒有捆綁這一操作,只要在 config.toml 指向你的主題即可。

我發現我偏愛 Hugo 的主題處理。你可以 克隆 clone (或者新建)主題到 themes 里它們自己的子文件夾里。這不僅使得當你開始時能輕鬆地切換主題,而且也能讓你用自己的文件替換主題里的任何組件。這意味著你能根據自己的品味自定義主題,而不用弄亂原始主題,使得這主題也可以通用於其他人。當然如果有一個你覺得其他用戶會覺得值得的改變,你仍然可以編輯源文件,提交一個 PR( 拉取請求 pull request )給主題維護者。

工作流程

一旦你設置好初始的配置,Jekyll 和 Hugo 的網站建設流程都很相似。兩者都有一個實時的 serve 命令,能在你的電腦上運行一個小型、輕量級的網頁伺服器,所以你能在在本地測試你的網站而不用上傳到哪裡。很棒的是無論你是運行著 jekyll serve 還是 hugo serve,都默認配置為當你為之開發時,監視你對網站的任何修改。當你在瀏覽器里看本地版的網站時,它會根據你的修改自動更新,不管你改的是內容、配置、主題、還僅僅是一張圖片。這確實很方便和節約時間。

在兩個系統中都是用 Markdown 寫你的網站內容。如果碰巧你不熟悉 Markdown,(我來解釋下,)它是種很簡單的純文本編寫方式,還能有一些很好用的格式化符號。它很容易使用而且可閱讀。而且因為是純文本,你的內容(其實是你的網站)很容易進行版本控制。這是我最近寫幾乎所有東西的主要方式。

新內容能通過在正確的地方手動創建文件添加到網站里。新的文件只需要是有恰當的 前置配置 front matter 元數據的 Markdown 文件即可。至於配置文件,Jekyll 對於前置配置使用 YAML 語法,Hugo 接受 TOML、YAML 或者 JSON(默認是 TOML)。新文件需要放置在正確的文件夾內,在 Jekyll 里你需要把你編寫中的文件和已經完成了的內容頁分別放在 _drafts_posts 目錄中。在 Hugo 中只有單獨一個 content 目錄。你可以根據文件的前置配置判斷這是否是一個草稿。

現在,雖然可以手動完成所有這些事情,但是 Hugo 提供了一些方便的功能確保你的新文件創建在正確的文件里,那些文件也用恰當的前置配置預先配置好了。簡單地在終端中進入你網站的目錄,輸入 hugo new content/<page.md><page.md> 代表著你想新建的新頁面。你甚至可以設置些包含為不同頁面自定義的前置配置、叫原型的模版(例如在你的網頁上同時有博客和播客)。

當你的網頁弄好後,你能關閉你的預覽伺服器,並用一個命令來建立你網站的真正頁面。在 Jekyll 里是 jekyll build,Hugo 就僅僅是 hugo,Jekyll 把完成好的頁面放在 _site 的子目錄中。然而 Hugo 把這些文件放在名為 public 的子目錄中。不管哪種情況,一旦你完成後,你就有了一個完整的靜態網站,你能上傳並把它託管在幾乎任何地方。

可拓展性

Hugo 和 Jekyll 都能讓你自定義你自己的網站上哪怕最小的一個點。然而就可拓展性而言,現在 Jekyll 因其插件 API 而遠遠領先。因為這種插件結構,很容易為你用 Jekyll 生成的網站添加功能,通過 Jekyll 社區或者你自己寫的相當短的代碼片段就能完成。

Hugo 現在根本沒有插件 API,所以添加功能有點難。希望以後支持編寫並包含插件。但是現在看不出有人在做這一點。

結論

大體上講,Hugo 和 Jekyll 十分相似。歸根結底由你工作體驗和你的網站需求決定。如果你已經設置好了 RubyGems 環境而且你需要插件的可拓展性,Jekyll 是你的選擇。然而,如果你看重一個簡單的工作流程,一個直接自定義網站的方式,那你首選 Hugo。

我發現我更喜歡 Hugo 的方法,而且在建設一個小型網站,我不需要任何插件。當然,每個人的需求都不同。你會為你的網站選擇哪一個靜態頁面生成器?

(題圖:opensource.com)

via: https://opensource.com/article/17/5/hugo-vs-jekyll

作者:Jason van Gumster 譯者:ypingcn 校對:wxy

本文由 LCTT 原創編譯,Linux中國 榮譽推出


本文轉載來自 Linux 中國: https://github.com/Linux-CN/archive

對這篇文章感覺如何?

太棒了
0
不錯
0
愛死了
0
不太好
0
感覺很糟
0
雨落清風。心向陽

    You may also like

    Leave a reply

    您的郵箱地址不會被公開。 必填項已用 * 標註

    此站點使用Akismet來減少垃圾評論。了解我們如何處理您的評論數據

    More in:Linux中國